ngx-image-cropper - npm Package Compare versions

Comparing version 1.5.0 to 1.5.1

bundles/ngx-image-cropper.umd.js

@@ -679,6 +679,8 @@ (function (global, factory) {
         ImageCropperComponent.prototype.setMaxSize = function () {
-            var sourceImageElement = this.sourceImage.nativeElement;
-            this.maxSize.width = sourceImageElement.offsetWidth;
-            this.maxSize.height = sourceImageElement.offsetHeight;
-            this.marginLeft = this.sanitizer.bypassSecurityTrustStyle('calc(50% - ' + this.maxSize.width / 2 + 'px)');
+            if (this.sourceImage) {
+                var sourceImageElement = this.sourceImage.nativeElement;
+                this.maxSize.width = sourceImageElement.offsetWidth;
+                this.maxSize.height = sourceImageElement.offsetHeight;
+                this.marginLeft = this.sanitizer.bypassSecurityTrustStyle('calc(50% - ' + this.maxSize.width / 2 + 'px)');
+            }
         };
@@ -962,3 +964,3 @@ ImageCropperComponent.prototype.setCropperScaledMinSize = function () {
         __decorate([
-            core.ViewChild('sourceImage', { static: false }),
+            core.ViewChild('sourceImage', { static: true }),
             __metadata("design:type", core.ElementRef)
@@ -965,0 +967,0 @@ ], ImageCropperComponent.prototype, "sourceImage", void 0);

bundles/ngx-image-cropper.umd.min.js

@@ -1,2 +0,2 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common"),require("@angular/platform-browser")):"function"==typeof define&&define.amd?define("ngx-image-cropper",["exports","@angular/core","@angular/common","@angular/platform-browser"],e):e((t=t||self)["ngx-image-cropper"]={},t.ng.core,t.ng.common,t.ng.platformBrowser)}(this,(function(t,e,i,r){"use strict";var o=function(){return(o=Object.assign||function(t){for(var e,i=1,r=arguments.length;i<r;i++)for(var o in e=arguments[i])Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o]);return t}).apply(this,arguments)};function s(t,e,i,r){var o,s=arguments.length,p=s<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)p=Reflect.decorate(t,e,i,r);else for(var a=t.length-1;a>=0;a--)(o=t[a])&&(p=(s<3?o(p):s>3?o(e,i,p):o(e,i))||p);return s>3&&p&&Object.defineProperty(e,i,p),p}function p(t,e){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,e)}function a(t){try{var e=function(t){var e=new DataView(function(t){t=t.replace(/^data\:([^\;]+)\;base64,/gim,"");for(var e=atob(t),i=e.length,r=new Uint8Array(i),o=0;o<i;o++)r[o]=e.charCodeAt(o);return r.buffer}(t));if(65496!=e.getUint16(0,!1))return-2;var i=e.byteLength,r=2;for(;r<i;){if(e.getUint16(r+2,!1)<=8)return-1;var o=e.getUint16(r,!1);if(r+=2,65505==o){if(1165519206!=e.getUint32(r+=2,!1))return-1;var s=18761==e.getUint16(r+=6,!1);r+=e.getUint32(r+4,s);var p=e.getUint16(r,s);r+=2;for(var a=0;a<p;a++)if(274==e.getUint16(r+12*a,s))return e.getUint16(r+12*a+8,s)}else{if(65280!=(65280&o))break;r+=e.getUint16(r,!1)}}return-1}(t);return e>1?n(t,e):Promise.resolve(t)}catch(t){return Promise.reject(t)}}function n(t,e){return new Promise((function(i,r){var o=new Image;o.onload=function(){var t=o.width,s=o.height,p=document.createElement("canvas"),a=p.getContext("2d");a?(4<e&&e<9?(p.width=s,p.height=t):(p.width=t,p.height=s),function(t,e,i,r){switch(e){case 2:t.transform(-1,0,0,1,i,0);break;case 3:t.transform(-1,0,0,-1,i,r);break;case 4:t.transform(1,0,0,-1,0,r);break;case 5:t.transform(0,1,1,0,0,0);break;case 6:t.transform(0,1,-1,0,r,0);break;case 7:t.transform(0,-1,-1,0,r,i);break;case 8:t.transform(0,-1,1,0,0,i)}}(a,e,t,s),a.drawImage(o,0,0),i(p.toDataURL())):r(new Error("No context"))},o.src=t}))}var h=function(){function t(t,i,r){this.sanitizer=t,this.cd=i,this.zone=r,this.setImageMaxSizeRetries=0,this.cropperScaledMinWidth=20,this.cropperScaledMinHeight=20,this.marginLeft="0px",this.imageVisible=!1,this.format="png",this.outputType="both",this.maintainAspectRatio=!0,this.aspectRatio=1,this.resizeToWidth=0,this.resizeToHeight=0,this.cropperMinWidth=0,this.cropperMinHeight=0,this.roundCropper=!1,this.onlyScaleDown=!1,this.imageQuality=92,this.autoCrop=!0,this.containWithinAspectRatio=!1,this.cropper={x1:-100,y1:-100,x2:1e4,y2:1e4},this.alignImage="center",this.startCropImage=new e.EventEmitter,this.imageCropped=new e.EventEmitter,this.imageCroppedBase64=new e.EventEmitter,this.imageCroppedFile=new e.EventEmitter,this.imageLoaded=new e.EventEmitter,this.cropperReady=new e.EventEmitter,this.loadImageFailed=new e.EventEmitter,this.initCropper()}return Object.defineProperty(t.prototype,"imageFileChanged",{set:function(t){this.initCropper(),t&&this.loadImageFile(t)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"imageChangedEvent",{set:function(t){this.initCropper(),t&&t.target&&t.target.files&&t.target.files.length>0&&this.loadImageFile(t.target.files[0])},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"imageBase64",{set:function(t){this.initCropper(),this.checkExifAndLoadBase64Image(t)},enumerable:!0,configurable:!0}),t.prototype.ngOnChanges=function(t){t.cropper&&(this.setMaxSize(),this.setCropperScaledMinSize(),this.checkCropperPosition(!1),this.doAutoCrop(),this.cd.markForCheck()),t.aspectRatio&&this.imageVisible&&this.resetCropperPosition()},t.prototype.initCropper=function(){this.imageVisible=!1,this.originalImage=null,this.safeImgDataUrl="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQYV2NgAAIAAAUAAarVyFEAAAAASUVORK5CYII=",this.moveStart={active:!1,type:null,position:null,x1:0,y1:0,x2:0,y2:0,clientX:0,clientY:0},this.maxSize={width:0,height:0},this.originalSize={width:0,height:0},this.cropper.x1=-100,this.cropper.y1=-100,this.cropper.x2=1e4,this.cropper.y2=1e4},t.prototype.loadImageFile=function(t){var e=this,i=new FileReader;i.onload=function(i){var r=t.type;e.isValidImageType(r)?e.checkExifAndLoadBase64Image(i.target.result):e.loadImageFailed.emit()},i.readAsDataURL(t)},t.prototype.isValidImageType=function(t){return/image\/(png|jpg|jpeg|bmp|gif|tiff)/.test(t)},t.prototype.checkExifAndLoadBase64Image=function(t){var e=this;a(t).then((function(t){return e.fitImageToAspectRatio(t)})).then((function(t){return e.loadBase64Image(t)})).catch((function(){return e.loadImageFailed.emit()}))},t.prototype.fitImageToAspectRatio=function(t){return this.containWithinAspectRatio?(e=t,i=this.aspectRatio,new Promise((function(t,r){var o=new Image;o.onload=function(){var e=document.createElement("canvas"),s=e.getContext("2d");if(s){var p=o.height*i,a=o.width/i;e.width=Math.max(o.width,p),e.height=Math.max(o.height,a);var n=(e.width-o.width)/2,h=(e.height-o.height)/2;s.drawImage(o,n,h),t(e.toDataURL())}else r(new Error("No context"))},o.src=e}))):Promise.resolve(t);var e,i},t.prototype.loadBase64Image=function(t){var e=this;this.originalBase64=t,this.safeImgDataUrl=this.sanitizer.bypassSecurityTrustResourceUrl(t),this.originalImage=new Image,this.originalImage.onload=function(){e.originalSize.width=e.originalImage.width,e.originalSize.height=e.originalImage.height,e.cd.markForCheck()},this.originalImage.src=t},t.prototype.imageLoadedInView=function(){var t=this;null!=this.originalImage&&(this.imageLoaded.emit(),this.setImageMaxSizeRetries=0,setTimeout((function(){return t.checkImageMaxSizeRecursively()})))},t.prototype.checkImageMaxSizeRecursively=function(){var t=this;this.setImageMaxSizeRetries>40?this.loadImageFailed.emit():this.sourceImage&&this.sourceImage.nativeElement&&this.sourceImage.nativeElement.offsetWidth>0?(this.setMaxSize(),this.setCropperScaledMinSize(),this.resetCropperPosition(),this.cropperReady.emit(),this.cd.markForCheck()):(this.setImageMaxSizeRetries++,setTimeout((function(){t.checkImageMaxSizeRecursively()}),50))},t.prototype.onResize=function(){this.resizeCropperPosition(),this.setMaxSize(),this.setCropperScaledMinSize()},t.prototype.rotateLeft=function(){this.transformBase64(8)},t.prototype.rotateRight=function(){this.transformBase64(6)},t.prototype.flipHorizontal=function(){this.transformBase64(2)},t.prototype.flipVertical=function(){this.transformBase64(4)},t.prototype.transformBase64=function(t){var e=this;this.originalBase64&&n(this.originalBase64,t).then((function(t){return e.fitImageToAspectRatio(t)})).then((function(t){return e.loadBase64Image(t)}))},t.prototype.resizeCropperPosition=function(){var t=this.sourceImage.nativeElement;this.maxSize.width===t.offsetWidth&&this.maxSize.height===t.offsetHeight||(this.cropper.x1=this.cropper.x1*t.offsetWidth/this.maxSize.width,this.cropper.x2=this.cropper.x2*t.offsetWidth/this.maxSize.width,this.cropper.y1=this.cropper.y1*t.offsetHeight/this.maxSize.height,this.cropper.y2=this.cropper.y2*t.offsetHeight/this.maxSize.height)},t.prototype.resetCropperPosition=function(){var t=this.sourceImage.nativeElement;if(this.maintainAspectRatio)if(t.offsetWidth/this.aspectRatio<t.offsetHeight){this.cropper.x1=0,this.cropper.x2=t.offsetWidth;var e=t.offsetWidth/this.aspectRatio;this.cropper.y1=(t.offsetHeight-e)/2,this.cropper.y2=this.cropper.y1+e}else{this.cropper.y1=0,this.cropper.y2=t.offsetHeight;var i=t.offsetHeight*this.aspectRatio;this.cropper.x1=(t.offsetWidth-i)/2,this.cropper.x2=this.cropper.x1+i}else this.cropper.x1=0,this.cropper.x2=t.offsetWidth,this.cropper.y1=0,this.cropper.y2=t.offsetHeight;this.doAutoCrop(),this.imageVisible=!0},t.prototype.startMove=function(t,e,i){void 0===i&&(i=null),t.preventDefault(),this.moveStart=o({active:!0,type:e,position:i,clientX:this.getClientX(t),clientY:this.getClientY(t)},this.cropper)},t.prototype.moveImg=function(t){this.moveStart.active&&(t.stopPropagation(),t.preventDefault(),"move"===this.moveStart.type?(this.move(t),this.checkCropperPosition(!0)):"resize"===this.moveStart.type&&(this.resize(t),this.checkCropperPosition(!1)),this.cd.detectChanges())},t.prototype.setMaxSize=function(){var t=this.sourceImage.nativeElement;this.maxSize.width=t.offsetWidth,this.maxSize.height=t.offsetHeight,this.marginLeft=this.sanitizer.bypassSecurityTrustStyle("calc(50% - "+this.maxSize.width/2+"px)")},t.prototype.setCropperScaledMinSize=function(){this.originalImage?(this.setCropperScaledMinWidth(),this.setCropperScaledMinHeight()):(this.cropperScaledMinWidth=20,this.cropperScaledMinHeight=20)},t.prototype.setCropperScaledMinWidth=function(){this.cropperScaledMinWidth=this.cropperMinWidth>0?Math.max(20,this.cropperMinWidth/this.originalImage.width*this.maxSize.width):20},t.prototype.setCropperScaledMinHeight=function(){this.maintainAspectRatio?this.cropperScaledMinHeight=Math.max(20,this.cropperScaledMinWidth/this.aspectRatio):this.cropperMinHeight>0?this.cropperScaledMinHeight=Math.max(20,this.cropperMinHeight/this.originalImage.height*this.maxSize.height):this.cropperScaledMinHeight=20},t.prototype.checkCropperPosition=function(t){void 0===t&&(t=!1),this.cropper.x1<0&&(this.cropper.x2-=t?this.cropper.x1:0,this.cropper.x1=0),this.cropper.y1<0&&(this.cropper.y2-=t?this.cropper.y1:0,this.cropper.y1=0),this.cropper.x2>this.maxSize.width&&(this.cropper.x1-=t?this.cropper.x2-this.maxSize.width:0,this.cropper.x2=this.maxSize.width),this.cropper.y2>this.maxSize.height&&(this.cropper.y1-=t?this.cropper.y2-this.maxSize.height:0,this.cropper.y2=this.maxSize.height)},t.prototype.moveStop=function(){this.moveStart.active&&(this.moveStart.active=!1,this.doAutoCrop())},t.prototype.move=function(t){var e=this.getClientX(t)-this.moveStart.clientX,i=this.getClientY(t)-this.moveStart.clientY;this.cropper.x1=this.moveStart.x1+e,this.cropper.y1=this.moveStart.y1+i,this.cropper.x2=this.moveStart.x2+e,this.cropper.y2=this.moveStart.y2+i},t.prototype.resize=function(t){var e=this.getClientX(t)-this.moveStart.clientX,i=this.getClientY(t)-this.moveStart.clientY;switch(this.moveStart.position){case"left":this.cropper.x1=Math.min(this.moveStart.x1+e,this.cropper.x2-this.cropperScaledMinWidth);break;case"topleft":this.cropper.x1=Math.min(this.moveStart.x1+e,this.cropper.x2-this.cropperScaledMinWidth),this.cropper.y1=Math.min(this.moveStart.y1+i,this.cropper.y2-this.cropperScaledMinHeight);break;case"top":this.cropper.y1=Math.min(this.moveStart.y1+i,this.cropper.y2-this.cropperScaledMinHeight);break;case"topright":this.cropper.x2=Math.max(this.moveStart.x2+e,this.cropper.x1+this.cropperScaledMinWidth),this.cropper.y1=Math.min(this.moveStart.y1+i,this.cropper.y2-this.cropperScaledMinHeight);break;case"right":this.cropper.x2=Math.max(this.moveStart.x2+e,this.cropper.x1+this.cropperScaledMinWidth);break;case"bottomright":this.cropper.x2=Math.max(this.moveStart.x2+e,this.cropper.x1+this.cropperScaledMinWidth),this.cropper.y2=Math.max(this.moveStart.y2+i,this.cropper.y1+this.cropperScaledMinHeight);break;case"bottom":this.cropper.y2=Math.max(this.moveStart.y2+i,this.cropper.y1+this.cropperScaledMinHeight);break;case"bottomleft":this.cropper.x1=Math.min(this.moveStart.x1+e,this.cropper.x2-this.cropperScaledMinWidth),this.cropper.y2=Math.max(this.moveStart.y2+i,this.cropper.y1+this.cropperScaledMinHeight)}this.maintainAspectRatio&&this.checkAspectRatio()},t.prototype.checkAspectRatio=function(){var t=0,e=0;switch(this.moveStart.position){case"top":this.cropper.x2=this.cropper.x1+(this.cropper.y2-this.cropper.y1)*this.aspectRatio,t=Math.max(this.cropper.x2-this.maxSize.width,0),e=Math.max(0-this.cropper.y1,0),(t>0||e>0)&&(this.cropper.x2-=e*this.aspectRatio>t?e*this.aspectRatio:t,this.cropper.y1+=e*this.aspectRatio>t?e:t/this.aspectRatio);break;case"bottom":this.cropper.x2=this.cropper.x1+(this.cropper.y2-this.cropper.y1)*this.aspectRatio,t=Math.max(this.cropper.x2-this.maxSize.width,0),e=Math.max(this.cropper.y2-this.maxSize.height,0),(t>0||e>0)&&(this.cropper.x2-=e*this.aspectRatio>t?e*this.aspectRatio:t,this.cropper.y2-=e*this.aspectRatio>t?e:t/this.aspectRatio);break;case"topleft":this.cropper.y1=this.cropper.y2-(this.cropper.x2-this.cropper.x1)/this.aspectRatio,t=Math.max(0-this.cropper.x1,0),e=Math.max(0-this.cropper.y1,0),(t>0||e>0)&&(this.cropper.x1+=e*this.aspectRatio>t?e*this.aspectRatio:t,this.cropper.y1+=e*this.aspectRatio>t?e:t/this.aspectRatio);break;case"topright":this.cropper.y1=this.cropper.y2-(this.cropper.x2-this.cropper.x1)/this.aspectRatio,t=Math.max(this.cropper.x2-this.maxSize.width,0),e=Math.max(0-this.cropper.y1,0),(t>0||e>0)&&(this.cropper.x2-=e*this.aspectRatio>t?e*this.aspectRatio:t,this.cropper.y1+=e*this.aspectRatio>t?e:t/this.aspectRatio);break;case"right":case"bottomright":this.cropper.y2=this.cropper.y1+(this.cropper.x2-this.cropper.x1)/this.aspectRatio,t=Math.max(this.cropper.x2-this.maxSize.width,0),e=Math.max(this.cropper.y2-this.maxSize.height,0),(t>0||e>0)&&(this.cropper.x2-=e*this.aspectRatio>t?e*this.aspectRatio:t,this.cropper.y2-=e*this.aspectRatio>t?e:t/this.aspectRatio);break;case"left":case"bottomleft":this.cropper.y2=this.cropper.y1+(this.cropper.x2-this.cropper.x1)/this.aspectRatio,t=Math.max(0-this.cropper.x1,0),e=Math.max(this.cropper.y2-this.maxSize.height,0),(t>0||e>0)&&(this.cropper.x1+=e*this.aspectRatio>t?e*this.aspectRatio:t,this.cropper.y2-=e*this.aspectRatio>t?e:t/this.aspectRatio)}},t.prototype.doAutoCrop=function(){this.autoCrop&&this.crop()},t.prototype.crop=function(t){if(void 0===t&&(t=this.outputType),this.sourceImage.nativeElement&&null!=this.originalImage){this.startCropImage.emit();var e=this.getImagePosition(),i=e.x2-e.x1,r=e.y2-e.y1,s=document.createElement("canvas");s.width=i,s.height=r;var p=s.getContext("2d");if(p){null!=this.backgroundColor&&(p.fillStyle=this.backgroundColor,p.fillRect(0,0,i,r)),p.drawImage(this.originalImage,e.x1,e.y1,i,r,0,0,i,r);var a={width:i,height:r,imagePosition:e,cropperPosition:o({},this.cropper)},n=this.getResizeRatio(i,r);return 1!==n&&(a.width=Math.round(i*n),a.height=this.maintainAspectRatio?Math.round(a.width/this.aspectRatio):Math.round(r*n),function(t,e,i,r){void 0===r&&(r=!0);var o=t.width,s=t.height,p=o/(e=Math.round(e)),a=s/(i=Math.round(i)),n=Math.ceil(p/2),h=Math.ceil(a/2),c=t.getContext("2d");if(c){for(var g=c.getImageData(0,0,o,s),l=c.createImageData(e,i),m=g.data,d=l.data,u=0;u<i;u++)for(var f=0;f<e;f++){var y=4*(f+u*e),v=u*a,x=0,b=0,z=0,S=0,M=0,w=0,I=0,R=Math.floor(f*p),C=Math.floor(u*a),A=Math.ceil((f+1)*p),k=Math.ceil((u+1)*a);A=Math.min(A,o),k=Math.min(k,s);for(var O=C;O<k;O++)for(var H=Math.abs(v-O)/h,j=f*p,E=H*H,W=R;W<A;W++){var T=Math.abs(j-W)/n,B=Math.sqrt(E+T*T);if(!(B>=1)){var P=4*(W+O*o);I+=(x=2*B*B*B-3*B*B+1)*m[P+3],z+=x,m[P+3]<255&&(x=x*m[P+3]/250),S+=x*m[P],M+=x*m[P+1],w+=x*m[P+2],b+=x}}d[y]=S/b,d[y+1]=M/b,d[y+2]=w/b,d[y+3]=I/z}r?(t.width=e,t.height=i):c.clearRect(0,0,o,s),c.putImageData(l,0,0)}}(s,a.width,a.height)),this.cropToOutputType(t,s,a)}}return null},t.prototype.getImagePosition=function(){var t=this.sourceImage.nativeElement,e=this.originalSize.width/t.offsetWidth;return{x1:Math.round(this.cropper.x1*e),y1:Math.round(this.cropper.y1*e),x2:Math.min(Math.round(this.cropper.x2*e),this.originalSize.width),y2:Math.min(Math.round(this.cropper.y2*e),this.originalSize.height)}},t.prototype.cropToOutputType=function(t,e,i){var r=this;switch(t){case"file":return this.cropToFile(e).then((function(t){return i.file=t,r.imageCropped.emit(i),i}));case"both":return i.base64=this.cropToBase64(e),this.cropToFile(e).then((function(t){return i.file=t,r.imageCropped.emit(i),i}));default:return i.base64=this.cropToBase64(e),this.imageCropped.emit(i),i}},t.prototype.cropToBase64=function(t){var e=t.toDataURL("image/"+this.format,this.getQuality());return this.imageCroppedBase64.emit(e),e},t.prototype.cropToFile=function(t){var e=this;return this.getCanvasBlob(t).then((function(t){return t&&e.imageCroppedFile.emit(t),t}))},t.prototype.getCanvasBlob=function(t){var e=this;return new Promise((function(i){t.toBlob((function(t){return e.zone.run((function(){return i(t)}))}),"image/"+e.format,e.getQuality())}))},t.prototype.getQuality=function(){return Math.min(1,Math.max(0,this.imageQuality/100))},t.prototype.getResizeRatio=function(t,e){if(this.resizeToWidth>0){if(!this.onlyScaleDown||t>this.resizeToWidth)return this.resizeToWidth/t}else if(this.resizeToHeight>0&&(!this.onlyScaleDown||e>this.resizeToHeight))return this.resizeToHeight/e;return 1},t.prototype.getClientX=function(t){return t.touches&&t.touches[0]&&t.touches[0].clientX||t.clientX},t.prototype.getClientY=function(t){return t.touches&&t.touches[0]&&t.touches[0].clientY||t.clientY},t.ctorParameters=function(){return[{type:r.DomSanitizer},{type:e.ChangeDetectorRef},{type:e.NgZone}]},s([e.ViewChild("sourceImage",{static:!1}),p("design:type",e.ElementRef)],t.prototype,"sourceImage",void 0),s([e.Input(),p("design:type",File),p("design:paramtypes",[File])],t.prototype,"imageFileChanged",null),s([e.Input(),p("design:type",Object),p("design:paramtypes",[Object])],t.prototype,"imageChangedEvent",null),s([e.Input(),p("design:type",String),p("design:paramtypes",[String])],t.prototype,"imageBase64",null),s([e.Input(),p("design:type",String)],t.prototype,"format",void 0),s([e.Input(),p("design:type",String)],t.prototype,"outputType",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"maintainAspectRatio",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"aspectRatio",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"resizeToWidth",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"resizeToHeight",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"cropperMinWidth",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"cropperMinHeight",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"roundCropper",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"onlyScaleDown",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"imageQuality",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"autoCrop",void 0),s([e.Input(),p("design:type",String)],t.prototype,"backgroundColor",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"containWithinAspectRatio",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"cropper",void 0),s([e.HostBinding("style.text-align"),e.Input(),p("design:type",String)],t.prototype,"alignImage",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"startCropImage",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"imageCropped",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"imageCroppedBase64",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"imageCroppedFile",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"imageLoaded",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"cropperReady",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"loadImageFailed",void 0),s([e.HostListener("window:resize"),p("design:type",Function),p("design:paramtypes",[]),p("design:returntype",void 0)],t.prototype,"onResize",null),s([e.HostListener("document:mousemove",["$event"]),e.HostListener("document:touchmove",["$event"]),p("design:type",Function),p("design:paramtypes",[Object]),p("design:returntype",void 0)],t.prototype,"moveImg",null),s([e.HostListener("document:mouseup"),e.HostListener("document:touchend"),p("design:type",Function),p("design:paramtypes",[]),p("design:returntype",void 0)],t.prototype,"moveStop",null),t=s([e.Component({selector:"image-cropper",template:'<div [style.background]="imageVisible && backgroundColor">\n    <img\n        #sourceImage\n        class="source-image"\n        [src]="safeImgDataUrl"\n        [style.visibility]="imageVisible ? \'visible\' : \'hidden\'"\n        (load)="imageLoadedInView()"\n    />\n    <div class="cropper"\n         *ngIf="imageVisible"\n         [class.rounded]="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    >\n        <div\n                (mousedown)="startMove($event, \'move\')"\n                (touchstart)="startMove($event, \'move\')"\n                class="move"\n        >&nbsp;</div>\n        <span\n                class="resize topleft"\n                (mousedown)="startMove($event, \'resize\', \'topleft\')"\n                (touchstart)="startMove($event, \'resize\', \'topleft\')"\n        ><span class="square"></span></span>\n        <span\n                class="resize top"\n        ><span class="square"></span></span>\n        <span\n                class="resize topright"\n                (mousedown)="startMove($event, \'resize\', \'topright\')"\n                (touchstart)="startMove($event, \'resize\', \'topright\')"\n        ><span class="square"></span></span>\n        <span\n                class="resize right"\n        ><span class="square"></span></span>\n        <span\n                class="resize bottomright"\n                (mousedown)="startMove($event, \'resize\', \'bottomright\')"\n                (touchstart)="startMove($event, \'resize\', \'bottomright\')"\n        ><span class="square"></span></span>\n        <span\n                class="resize bottom"\n        ><span class="square"></span></span>\n        <span\n                class="resize bottomleft"\n                (mousedown)="startMove($event, \'resize\', \'bottomleft\')"\n                (touchstart)="startMove($event, \'resize\', \'bottomleft\')"\n        ><span class="square"></span></span>\n        <span\n                class="resize left"\n        ><span class="square"></span></span>\n        <span\n                class="resize-bar top"\n                (mousedown)="startMove($event, \'resize\', \'top\')"\n                (touchstart)="startMove($event, \'resize\', \'top\')"\n        ></span>\n        <span\n                class="resize-bar right"\n                (mousedown)="startMove($event, \'resize\', \'right\')"\n                (touchstart)="startMove($event, \'resize\', \'right\')"\n        ></span>\n        <span\n                class="resize-bar bottom"\n                (mousedown)="startMove($event, \'resize\', \'bottom\')"\n                (touchstart)="startMove($event, \'resize\', \'bottom\')"\n        ></span>\n        <span\n                class="resize-bar left"\n                (mousedown)="startMove($event, \'resize\', \'left\')"\n                (touchstart)="startMove($event, \'resize\', \'left\')"\n        ></span>\n    </div>\n</div>\n',changeDetection:e.ChangeDetectionStrategy.OnPush,styles:[':host{display:flex;position:relative;width:100%;max-width:100%;max-height:100%;overflow:hidden;padding:5px;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host>div{position:relative;width:100%}:host>div img.source-image{max-width:100%;max-height:100%}:host .cropper{position:absolute;display:flex;color:#53535c;background:0 0;touch-action:none;outline:rgba(255,255,255,.3) solid 100vw}:host .cropper:after{position:absolute;content:"";top:0;bottom:0;left:0;right:0;pointer-events:none;border:1px dashed;opacity:.75;color:inherit;z-index:1}:host .cropper .move{width:100%;cursor:move;border:1px solid rgba(255,255,255,.5)}:host .cropper .resize{position:absolute;display:inline-block;line-height:6px;padding:8px;opacity:.85;z-index:1}:host .cropper .resize .square{display:inline-block;background:#53535c;width:6px;height:6px;border:1px solid rgba(255,255,255,.5);box-sizing:content-box}:host .cropper .resize.topleft{top:-12px;left:-12px;cursor:nwse-resize}:host .cropper .resize.top{top:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .cropper .resize.topright{top:-12px;right:-12px;cursor:nesw-resize}:host .cropper .resize.right{top:calc(50% - 12px);right:-12px;cursor:ew-resize}:host .cropper .resize.bottomright{bottom:-12px;right:-12px;cursor:nwse-resize}:host .cropper .resize.bottom{bottom:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .cropper .resize.bottomleft{bottom:-12px;left:-12px;cursor:nesw-resize}:host .cropper .resize.left{top:calc(50% - 12px);left:-12px;cursor:ew-resize}:host .cropper .resize-bar{position:absolute;z-index:1}:host .cropper .resize-bar.top{top:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .cropper .resize-bar.right{top:11px;right:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .cropper .resize-bar.bottom{bottom:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .cropper .resize-bar.left{top:11px;left:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .cropper.rounded{outline-color:transparent}:host .cropper.rounded:after{border-radius:100%;box-shadow:0 0 0 100vw rgba(255,255,255,.3)}@media (orientation:portrait){:host .cropper{outline-width:100vh}:host .cropper.rounded:after{box-shadow:0 0 0 100vh rgba(255,255,255,.3)}}:host .cropper.rounded .move{border-radius:100%}']}),p("design:paramtypes",[r.DomSanitizer,e.ChangeDetectorRef,e.NgZone])],t)}(),c=function(){function t(){}return t=s([e.NgModule({imports:[i.CommonModule],declarations:[h],exports:[h]})],t)}();t.ImageCropperComponent=h,t.ImageCropperModule=c,Object.defineProperty(t,"__esModule",{value:!0})}));
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common"),require("@angular/platform-browser")):"function"==typeof define&&define.amd?define("ngx-image-cropper",["exports","@angular/core","@angular/common","@angular/platform-browser"],e):e((t=t||self)["ngx-image-cropper"]={},t.ng.core,t.ng.common,t.ng.platformBrowser)}(this,(function(t,e,i,r){"use strict";var o=function(){return(o=Object.assign||function(t){for(var e,i=1,r=arguments.length;i<r;i++)for(var o in e=arguments[i])Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o]);return t}).apply(this,arguments)};function s(t,e,i,r){var o,s=arguments.length,p=s<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)p=Reflect.decorate(t,e,i,r);else for(var a=t.length-1;a>=0;a--)(o=t[a])&&(p=(s<3?o(p):s>3?o(e,i,p):o(e,i))||p);return s>3&&p&&Object.defineProperty(e,i,p),p}function p(t,e){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,e)}function a(t){try{var e=function(t){var e=new DataView(function(t){t=t.replace(/^data\:([^\;]+)\;base64,/gim,"");for(var e=atob(t),i=e.length,r=new Uint8Array(i),o=0;o<i;o++)r[o]=e.charCodeAt(o);return r.buffer}(t));if(65496!=e.getUint16(0,!1))return-2;var i=e.byteLength,r=2;for(;r<i;){if(e.getUint16(r+2,!1)<=8)return-1;var o=e.getUint16(r,!1);if(r+=2,65505==o){if(1165519206!=e.getUint32(r+=2,!1))return-1;var s=18761==e.getUint16(r+=6,!1);r+=e.getUint32(r+4,s);var p=e.getUint16(r,s);r+=2;for(var a=0;a<p;a++)if(274==e.getUint16(r+12*a,s))return e.getUint16(r+12*a+8,s)}else{if(65280!=(65280&o))break;r+=e.getUint16(r,!1)}}return-1}(t);return e>1?n(t,e):Promise.resolve(t)}catch(t){return Promise.reject(t)}}function n(t,e){return new Promise((function(i,r){var o=new Image;o.onload=function(){var t=o.width,s=o.height,p=document.createElement("canvas"),a=p.getContext("2d");a?(4<e&&e<9?(p.width=s,p.height=t):(p.width=t,p.height=s),function(t,e,i,r){switch(e){case 2:t.transform(-1,0,0,1,i,0);break;case 3:t.transform(-1,0,0,-1,i,r);break;case 4:t.transform(1,0,0,-1,0,r);break;case 5:t.transform(0,1,1,0,0,0);break;case 6:t.transform(0,1,-1,0,r,0);break;case 7:t.transform(0,-1,-1,0,r,i);break;case 8:t.transform(0,-1,1,0,0,i)}}(a,e,t,s),a.drawImage(o,0,0),i(p.toDataURL())):r(new Error("No context"))},o.src=t}))}var h=function(){function t(t,i,r){this.sanitizer=t,this.cd=i,this.zone=r,this.setImageMaxSizeRetries=0,this.cropperScaledMinWidth=20,this.cropperScaledMinHeight=20,this.marginLeft="0px",this.imageVisible=!1,this.format="png",this.outputType="both",this.maintainAspectRatio=!0,this.aspectRatio=1,this.resizeToWidth=0,this.resizeToHeight=0,this.cropperMinWidth=0,this.cropperMinHeight=0,this.roundCropper=!1,this.onlyScaleDown=!1,this.imageQuality=92,this.autoCrop=!0,this.containWithinAspectRatio=!1,this.cropper={x1:-100,y1:-100,x2:1e4,y2:1e4},this.alignImage="center",this.startCropImage=new e.EventEmitter,this.imageCropped=new e.EventEmitter,this.imageCroppedBase64=new e.EventEmitter,this.imageCroppedFile=new e.EventEmitter,this.imageLoaded=new e.EventEmitter,this.cropperReady=new e.EventEmitter,this.loadImageFailed=new e.EventEmitter,this.initCropper()}return Object.defineProperty(t.prototype,"imageFileChanged",{set:function(t){this.initCropper(),t&&this.loadImageFile(t)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"imageChangedEvent",{set:function(t){this.initCropper(),t&&t.target&&t.target.files&&t.target.files.length>0&&this.loadImageFile(t.target.files[0])},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"imageBase64",{set:function(t){this.initCropper(),this.checkExifAndLoadBase64Image(t)},enumerable:!0,configurable:!0}),t.prototype.ngOnChanges=function(t){t.cropper&&(this.setMaxSize(),this.setCropperScaledMinSize(),this.checkCropperPosition(!1),this.doAutoCrop(),this.cd.markForCheck()),t.aspectRatio&&this.imageVisible&&this.resetCropperPosition()},t.prototype.initCropper=function(){this.imageVisible=!1,this.originalImage=null,this.safeImgDataUrl="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQYV2NgAAIAAAUAAarVyFEAAAAASUVORK5CYII=",this.moveStart={active:!1,type:null,position:null,x1:0,y1:0,x2:0,y2:0,clientX:0,clientY:0},this.maxSize={width:0,height:0},this.originalSize={width:0,height:0},this.cropper.x1=-100,this.cropper.y1=-100,this.cropper.x2=1e4,this.cropper.y2=1e4},t.prototype.loadImageFile=function(t){var e=this,i=new FileReader;i.onload=function(i){var r=t.type;e.isValidImageType(r)?e.checkExifAndLoadBase64Image(i.target.result):e.loadImageFailed.emit()},i.readAsDataURL(t)},t.prototype.isValidImageType=function(t){return/image\/(png|jpg|jpeg|bmp|gif|tiff)/.test(t)},t.prototype.checkExifAndLoadBase64Image=function(t){var e=this;a(t).then((function(t){return e.fitImageToAspectRatio(t)})).then((function(t){return e.loadBase64Image(t)})).catch((function(){return e.loadImageFailed.emit()}))},t.prototype.fitImageToAspectRatio=function(t){return this.containWithinAspectRatio?(e=t,i=this.aspectRatio,new Promise((function(t,r){var o=new Image;o.onload=function(){var e=document.createElement("canvas"),s=e.getContext("2d");if(s){var p=o.height*i,a=o.width/i;e.width=Math.max(o.width,p),e.height=Math.max(o.height,a);var n=(e.width-o.width)/2,h=(e.height-o.height)/2;s.drawImage(o,n,h),t(e.toDataURL())}else r(new Error("No context"))},o.src=e}))):Promise.resolve(t);var e,i},t.prototype.loadBase64Image=function(t){var e=this;this.originalBase64=t,this.safeImgDataUrl=this.sanitizer.bypassSecurityTrustResourceUrl(t),this.originalImage=new Image,this.originalImage.onload=function(){e.originalSize.width=e.originalImage.width,e.originalSize.height=e.originalImage.height,e.cd.markForCheck()},this.originalImage.src=t},t.prototype.imageLoadedInView=function(){var t=this;null!=this.originalImage&&(this.imageLoaded.emit(),this.setImageMaxSizeRetries=0,setTimeout((function(){return t.checkImageMaxSizeRecursively()})))},t.prototype.checkImageMaxSizeRecursively=function(){var t=this;this.setImageMaxSizeRetries>40?this.loadImageFailed.emit():this.sourceImage&&this.sourceImage.nativeElement&&this.sourceImage.nativeElement.offsetWidth>0?(this.setMaxSize(),this.setCropperScaledMinSize(),this.resetCropperPosition(),this.cropperReady.emit(),this.cd.markForCheck()):(this.setImageMaxSizeRetries++,setTimeout((function(){t.checkImageMaxSizeRecursively()}),50))},t.prototype.onResize=function(){this.resizeCropperPosition(),this.setMaxSize(),this.setCropperScaledMinSize()},t.prototype.rotateLeft=function(){this.transformBase64(8)},t.prototype.rotateRight=function(){this.transformBase64(6)},t.prototype.flipHorizontal=function(){this.transformBase64(2)},t.prototype.flipVertical=function(){this.transformBase64(4)},t.prototype.transformBase64=function(t){var e=this;this.originalBase64&&n(this.originalBase64,t).then((function(t){return e.fitImageToAspectRatio(t)})).then((function(t){return e.loadBase64Image(t)}))},t.prototype.resizeCropperPosition=function(){var t=this.sourceImage.nativeElement;this.maxSize.width===t.offsetWidth&&this.maxSize.height===t.offsetHeight||(this.cropper.x1=this.cropper.x1*t.offsetWidth/this.maxSize.width,this.cropper.x2=this.cropper.x2*t.offsetWidth/this.maxSize.width,this.cropper.y1=this.cropper.y1*t.offsetHeight/this.maxSize.height,this.cropper.y2=this.cropper.y2*t.offsetHeight/this.maxSize.height)},t.prototype.resetCropperPosition=function(){var t=this.sourceImage.nativeElement;if(this.maintainAspectRatio)if(t.offsetWidth/this.aspectRatio<t.offsetHeight){this.cropper.x1=0,this.cropper.x2=t.offsetWidth;var e=t.offsetWidth/this.aspectRatio;this.cropper.y1=(t.offsetHeight-e)/2,this.cropper.y2=this.cropper.y1+e}else{this.cropper.y1=0,this.cropper.y2=t.offsetHeight;var i=t.offsetHeight*this.aspectRatio;this.cropper.x1=(t.offsetWidth-i)/2,this.cropper.x2=this.cropper.x1+i}else this.cropper.x1=0,this.cropper.x2=t.offsetWidth,this.cropper.y1=0,this.cropper.y2=t.offsetHeight;this.doAutoCrop(),this.imageVisible=!0},t.prototype.startMove=function(t,e,i){void 0===i&&(i=null),t.preventDefault(),this.moveStart=o({active:!0,type:e,position:i,clientX:this.getClientX(t),clientY:this.getClientY(t)},this.cropper)},t.prototype.moveImg=function(t){this.moveStart.active&&(t.stopPropagation(),t.preventDefault(),"move"===this.moveStart.type?(this.move(t),this.checkCropperPosition(!0)):"resize"===this.moveStart.type&&(this.resize(t),this.checkCropperPosition(!1)),this.cd.detectChanges())},t.prototype.setMaxSize=function(){if(this.sourceImage){var t=this.sourceImage.nativeElement;this.maxSize.width=t.offsetWidth,this.maxSize.height=t.offsetHeight,this.marginLeft=this.sanitizer.bypassSecurityTrustStyle("calc(50% - "+this.maxSize.width/2+"px)")}},t.prototype.setCropperScaledMinSize=function(){this.originalImage?(this.setCropperScaledMinWidth(),this.setCropperScaledMinHeight()):(this.cropperScaledMinWidth=20,this.cropperScaledMinHeight=20)},t.prototype.setCropperScaledMinWidth=function(){this.cropperScaledMinWidth=this.cropperMinWidth>0?Math.max(20,this.cropperMinWidth/this.originalImage.width*this.maxSize.width):20},t.prototype.setCropperScaledMinHeight=function(){this.maintainAspectRatio?this.cropperScaledMinHeight=Math.max(20,this.cropperScaledMinWidth/this.aspectRatio):this.cropperMinHeight>0?this.cropperScaledMinHeight=Math.max(20,this.cropperMinHeight/this.originalImage.height*this.maxSize.height):this.cropperScaledMinHeight=20},t.prototype.checkCropperPosition=function(t){void 0===t&&(t=!1),this.cropper.x1<0&&(this.cropper.x2-=t?this.cropper.x1:0,this.cropper.x1=0),this.cropper.y1<0&&(this.cropper.y2-=t?this.cropper.y1:0,this.cropper.y1=0),this.cropper.x2>this.maxSize.width&&(this.cropper.x1-=t?this.cropper.x2-this.maxSize.width:0,this.cropper.x2=this.maxSize.width),this.cropper.y2>this.maxSize.height&&(this.cropper.y1-=t?this.cropper.y2-this.maxSize.height:0,this.cropper.y2=this.maxSize.height)},t.prototype.moveStop=function(){this.moveStart.active&&(this.moveStart.active=!1,this.doAutoCrop())},t.prototype.move=function(t){var e=this.getClientX(t)-this.moveStart.clientX,i=this.getClientY(t)-this.moveStart.clientY;this.cropper.x1=this.moveStart.x1+e,this.cropper.y1=this.moveStart.y1+i,this.cropper.x2=this.moveStart.x2+e,this.cropper.y2=this.moveStart.y2+i},t.prototype.resize=function(t){var e=this.getClientX(t)-this.moveStart.clientX,i=this.getClientY(t)-this.moveStart.clientY;switch(this.moveStart.position){case"left":this.cropper.x1=Math.min(this.moveStart.x1+e,this.cropper.x2-this.cropperScaledMinWidth);break;case"topleft":this.cropper.x1=Math.min(this.moveStart.x1+e,this.cropper.x2-this.cropperScaledMinWidth),this.cropper.y1=Math.min(this.moveStart.y1+i,this.cropper.y2-this.cropperScaledMinHeight);break;case"top":this.cropper.y1=Math.min(this.moveStart.y1+i,this.cropper.y2-this.cropperScaledMinHeight);break;case"topright":this.cropper.x2=Math.max(this.moveStart.x2+e,this.cropper.x1+this.cropperScaledMinWidth),this.cropper.y1=Math.min(this.moveStart.y1+i,this.cropper.y2-this.cropperScaledMinHeight);break;case"right":this.cropper.x2=Math.max(this.moveStart.x2+e,this.cropper.x1+this.cropperScaledMinWidth);break;case"bottomright":this.cropper.x2=Math.max(this.moveStart.x2+e,this.cropper.x1+this.cropperScaledMinWidth),this.cropper.y2=Math.max(this.moveStart.y2+i,this.cropper.y1+this.cropperScaledMinHeight);break;case"bottom":this.cropper.y2=Math.max(this.moveStart.y2+i,this.cropper.y1+this.cropperScaledMinHeight);break;case"bottomleft":this.cropper.x1=Math.min(this.moveStart.x1+e,this.cropper.x2-this.cropperScaledMinWidth),this.cropper.y2=Math.max(this.moveStart.y2+i,this.cropper.y1+this.cropperScaledMinHeight)}this.maintainAspectRatio&&this.checkAspectRatio()},t.prototype.checkAspectRatio=function(){var t=0,e=0;switch(this.moveStart.position){case"top":this.cropper.x2=this.cropper.x1+(this.cropper.y2-this.cropper.y1)*this.aspectRatio,t=Math.max(this.cropper.x2-this.maxSize.width,0),e=Math.max(0-this.cropper.y1,0),(t>0||e>0)&&(this.cropper.x2-=e*this.aspectRatio>t?e*this.aspectRatio:t,this.cropper.y1+=e*this.aspectRatio>t?e:t/this.aspectRatio);break;case"bottom":this.cropper.x2=this.cropper.x1+(this.cropper.y2-this.cropper.y1)*this.aspectRatio,t=Math.max(this.cropper.x2-this.maxSize.width,0),e=Math.max(this.cropper.y2-this.maxSize.height,0),(t>0||e>0)&&(this.cropper.x2-=e*this.aspectRatio>t?e*this.aspectRatio:t,this.cropper.y2-=e*this.aspectRatio>t?e:t/this.aspectRatio);break;case"topleft":this.cropper.y1=this.cropper.y2-(this.cropper.x2-this.cropper.x1)/this.aspectRatio,t=Math.max(0-this.cropper.x1,0),e=Math.max(0-this.cropper.y1,0),(t>0||e>0)&&(this.cropper.x1+=e*this.aspectRatio>t?e*this.aspectRatio:t,this.cropper.y1+=e*this.aspectRatio>t?e:t/this.aspectRatio);break;case"topright":this.cropper.y1=this.cropper.y2-(this.cropper.x2-this.cropper.x1)/this.aspectRatio,t=Math.max(this.cropper.x2-this.maxSize.width,0),e=Math.max(0-this.cropper.y1,0),(t>0||e>0)&&(this.cropper.x2-=e*this.aspectRatio>t?e*this.aspectRatio:t,this.cropper.y1+=e*this.aspectRatio>t?e:t/this.aspectRatio);break;case"right":case"bottomright":this.cropper.y2=this.cropper.y1+(this.cropper.x2-this.cropper.x1)/this.aspectRatio,t=Math.max(this.cropper.x2-this.maxSize.width,0),e=Math.max(this.cropper.y2-this.maxSize.height,0),(t>0||e>0)&&(this.cropper.x2-=e*this.aspectRatio>t?e*this.aspectRatio:t,this.cropper.y2-=e*this.aspectRatio>t?e:t/this.aspectRatio);break;case"left":case"bottomleft":this.cropper.y2=this.cropper.y1+(this.cropper.x2-this.cropper.x1)/this.aspectRatio,t=Math.max(0-this.cropper.x1,0),e=Math.max(this.cropper.y2-this.maxSize.height,0),(t>0||e>0)&&(this.cropper.x1+=e*this.aspectRatio>t?e*this.aspectRatio:t,this.cropper.y2-=e*this.aspectRatio>t?e:t/this.aspectRatio)}},t.prototype.doAutoCrop=function(){this.autoCrop&&this.crop()},t.prototype.crop=function(t){if(void 0===t&&(t=this.outputType),this.sourceImage.nativeElement&&null!=this.originalImage){this.startCropImage.emit();var e=this.getImagePosition(),i=e.x2-e.x1,r=e.y2-e.y1,s=document.createElement("canvas");s.width=i,s.height=r;var p=s.getContext("2d");if(p){null!=this.backgroundColor&&(p.fillStyle=this.backgroundColor,p.fillRect(0,0,i,r)),p.drawImage(this.originalImage,e.x1,e.y1,i,r,0,0,i,r);var a={width:i,height:r,imagePosition:e,cropperPosition:o({},this.cropper)},n=this.getResizeRatio(i,r);return 1!==n&&(a.width=Math.round(i*n),a.height=this.maintainAspectRatio?Math.round(a.width/this.aspectRatio):Math.round(r*n),function(t,e,i,r){void 0===r&&(r=!0);var o=t.width,s=t.height,p=o/(e=Math.round(e)),a=s/(i=Math.round(i)),n=Math.ceil(p/2),h=Math.ceil(a/2),c=t.getContext("2d");if(c){for(var g=c.getImageData(0,0,o,s),l=c.createImageData(e,i),m=g.data,d=l.data,u=0;u<i;u++)for(var f=0;f<e;f++){var y=4*(f+u*e),v=u*a,x=0,b=0,z=0,S=0,M=0,w=0,I=0,R=Math.floor(f*p),C=Math.floor(u*a),A=Math.ceil((f+1)*p),k=Math.ceil((u+1)*a);A=Math.min(A,o),k=Math.min(k,s);for(var O=C;O<k;O++)for(var H=Math.abs(v-O)/h,j=f*p,E=H*H,W=R;W<A;W++){var T=Math.abs(j-W)/n,B=Math.sqrt(E+T*T);if(!(B>=1)){var P=4*(W+O*o);I+=(x=2*B*B*B-3*B*B+1)*m[P+3],z+=x,m[P+3]<255&&(x=x*m[P+3]/250),S+=x*m[P],M+=x*m[P+1],w+=x*m[P+2],b+=x}}d[y]=S/b,d[y+1]=M/b,d[y+2]=w/b,d[y+3]=I/z}r?(t.width=e,t.height=i):c.clearRect(0,0,o,s),c.putImageData(l,0,0)}}(s,a.width,a.height)),this.cropToOutputType(t,s,a)}}return null},t.prototype.getImagePosition=function(){var t=this.sourceImage.nativeElement,e=this.originalSize.width/t.offsetWidth;return{x1:Math.round(this.cropper.x1*e),y1:Math.round(this.cropper.y1*e),x2:Math.min(Math.round(this.cropper.x2*e),this.originalSize.width),y2:Math.min(Math.round(this.cropper.y2*e),this.originalSize.height)}},t.prototype.cropToOutputType=function(t,e,i){var r=this;switch(t){case"file":return this.cropToFile(e).then((function(t){return i.file=t,r.imageCropped.emit(i),i}));case"both":return i.base64=this.cropToBase64(e),this.cropToFile(e).then((function(t){return i.file=t,r.imageCropped.emit(i),i}));default:return i.base64=this.cropToBase64(e),this.imageCropped.emit(i),i}},t.prototype.cropToBase64=function(t){var e=t.toDataURL("image/"+this.format,this.getQuality());return this.imageCroppedBase64.emit(e),e},t.prototype.cropToFile=function(t){var e=this;return this.getCanvasBlob(t).then((function(t){return t&&e.imageCroppedFile.emit(t),t}))},t.prototype.getCanvasBlob=function(t){var e=this;return new Promise((function(i){t.toBlob((function(t){return e.zone.run((function(){return i(t)}))}),"image/"+e.format,e.getQuality())}))},t.prototype.getQuality=function(){return Math.min(1,Math.max(0,this.imageQuality/100))},t.prototype.getResizeRatio=function(t,e){if(this.resizeToWidth>0){if(!this.onlyScaleDown||t>this.resizeToWidth)return this.resizeToWidth/t}else if(this.resizeToHeight>0&&(!this.onlyScaleDown||e>this.resizeToHeight))return this.resizeToHeight/e;return 1},t.prototype.getClientX=function(t){return t.touches&&t.touches[0]&&t.touches[0].clientX||t.clientX},t.prototype.getClientY=function(t){return t.touches&&t.touches[0]&&t.touches[0].clientY||t.clientY},t.ctorParameters=function(){return[{type:r.DomSanitizer},{type:e.ChangeDetectorRef},{type:e.NgZone}]},s([e.ViewChild("sourceImage",{static:!0}),p("design:type",e.ElementRef)],t.prototype,"sourceImage",void 0),s([e.Input(),p("design:type",File),p("design:paramtypes",[File])],t.prototype,"imageFileChanged",null),s([e.Input(),p("design:type",Object),p("design:paramtypes",[Object])],t.prototype,"imageChangedEvent",null),s([e.Input(),p("design:type",String),p("design:paramtypes",[String])],t.prototype,"imageBase64",null),s([e.Input(),p("design:type",String)],t.prototype,"format",void 0),s([e.Input(),p("design:type",String)],t.prototype,"outputType",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"maintainAspectRatio",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"aspectRatio",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"resizeToWidth",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"resizeToHeight",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"cropperMinWidth",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"cropperMinHeight",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"roundCropper",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"onlyScaleDown",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"imageQuality",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"autoCrop",void 0),s([e.Input(),p("design:type",String)],t.prototype,"backgroundColor",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"containWithinAspectRatio",void 0),s([e.Input(),p("design:type",Object)],t.prototype,"cropper",void 0),s([e.HostBinding("style.text-align"),e.Input(),p("design:type",String)],t.prototype,"alignImage",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"startCropImage",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"imageCropped",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"imageCroppedBase64",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"imageCroppedFile",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"imageLoaded",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"cropperReady",void 0),s([e.Output(),p("design:type",Object)],t.prototype,"loadImageFailed",void 0),s([e.HostListener("window:resize"),p("design:type",Function),p("design:paramtypes",[]),p("design:returntype",void 0)],t.prototype,"onResize",null),s([e.HostListener("document:mousemove",["$event"]),e.HostListener("document:touchmove",["$event"]),p("design:type",Function),p("design:paramtypes",[Object]),p("design:returntype",void 0)],t.prototype,"moveImg",null),s([e.HostListener("document:mouseup"),e.HostListener("document:touchend"),p("design:type",Function),p("design:paramtypes",[]),p("design:returntype",void 0)],t.prototype,"moveStop",null),t=s([e.Component({selector:"image-cropper",template:'<div [style.background]="imageVisible && backgroundColor">\n    <img\n        #sourceImage\n        class="source-image"\n        [src]="safeImgDataUrl"\n        [style.visibility]="imageVisible ? \'visible\' : \'hidden\'"\n        (load)="imageLoadedInView()"\n    />\n    <div class="cropper"\n         *ngIf="imageVisible"\n         [class.rounded]="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    >\n        <div\n                (mousedown)="startMove($event, \'move\')"\n                (touchstart)="startMove($event, \'move\')"\n                class="move"\n        >&nbsp;</div>\n        <span\n                class="resize topleft"\n                (mousedown)="startMove($event, \'resize\', \'topleft\')"\n                (touchstart)="startMove($event, \'resize\', \'topleft\')"\n        ><span class="square"></span></span>\n        <span\n                class="resize top"\n        ><span class="square"></span></span>\n        <span\n                class="resize topright"\n                (mousedown)="startMove($event, \'resize\', \'topright\')"\n                (touchstart)="startMove($event, \'resize\', \'topright\')"\n        ><span class="square"></span></span>\n        <span\n                class="resize right"\n        ><span class="square"></span></span>\n        <span\n                class="resize bottomright"\n                (mousedown)="startMove($event, \'resize\', \'bottomright\')"\n                (touchstart)="startMove($event, \'resize\', \'bottomright\')"\n        ><span class="square"></span></span>\n        <span\n                class="resize bottom"\n        ><span class="square"></span></span>\n        <span\n                class="resize bottomleft"\n                (mousedown)="startMove($event, \'resize\', \'bottomleft\')"\n                (touchstart)="startMove($event, \'resize\', \'bottomleft\')"\n        ><span class="square"></span></span>\n        <span\n                class="resize left"\n        ><span class="square"></span></span>\n        <span\n                class="resize-bar top"\n                (mousedown)="startMove($event, \'resize\', \'top\')"\n                (touchstart)="startMove($event, \'resize\', \'top\')"\n        ></span>\n        <span\n                class="resize-bar right"\n                (mousedown)="startMove($event, \'resize\', \'right\')"\n                (touchstart)="startMove($event, \'resize\', \'right\')"\n        ></span>\n        <span\n                class="resize-bar bottom"\n                (mousedown)="startMove($event, \'resize\', \'bottom\')"\n                (touchstart)="startMove($event, \'resize\', \'bottom\')"\n        ></span>\n        <span\n                class="resize-bar left"\n                (mousedown)="startMove($event, \'resize\', \'left\')"\n                (touchstart)="startMove($event, \'resize\', \'left\')"\n        ></span>\n    </div>\n</div>\n',changeDetection:e.ChangeDetectionStrategy.OnPush,styles:[':host{display:flex;position:relative;width:100%;max-width:100%;max-height:100%;overflow:hidden;padding:5px;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host>div{position:relative;width:100%}:host>div img.source-image{max-width:100%;max-height:100%}:host .cropper{position:absolute;display:flex;color:#53535c;background:0 0;touch-action:none;outline:rgba(255,255,255,.3) solid 100vw}:host .cropper:after{position:absolute;content:"";top:0;bottom:0;left:0;right:0;pointer-events:none;border:1px dashed;opacity:.75;color:inherit;z-index:1}:host .cropper .move{width:100%;cursor:move;border:1px solid rgba(255,255,255,.5)}:host .cropper .resize{position:absolute;display:inline-block;line-height:6px;padding:8px;opacity:.85;z-index:1}:host .cropper .resize .square{display:inline-block;background:#53535c;width:6px;height:6px;border:1px solid rgba(255,255,255,.5);box-sizing:content-box}:host .cropper .resize.topleft{top:-12px;left:-12px;cursor:nwse-resize}:host .cropper .resize.top{top:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .cropper .resize.topright{top:-12px;right:-12px;cursor:nesw-resize}:host .cropper .resize.right{top:calc(50% - 12px);right:-12px;cursor:ew-resize}:host .cropper .resize.bottomright{bottom:-12px;right:-12px;cursor:nwse-resize}:host .cropper .resize.bottom{bottom:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .cropper .resize.bottomleft{bottom:-12px;left:-12px;cursor:nesw-resize}:host .cropper .resize.left{top:calc(50% - 12px);left:-12px;cursor:ew-resize}:host .cropper .resize-bar{position:absolute;z-index:1}:host .cropper .resize-bar.top{top:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .cropper .resize-bar.right{top:11px;right:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .cropper .resize-bar.bottom{bottom:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .cropper .resize-bar.left{top:11px;left:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .cropper.rounded{outline-color:transparent}:host .cropper.rounded:after{border-radius:100%;box-shadow:0 0 0 100vw rgba(255,255,255,.3)}@media (orientation:portrait){:host .cropper{outline-width:100vh}:host .cropper.rounded:after{box-shadow:0 0 0 100vh rgba(255,255,255,.3)}}:host .cropper.rounded .move{border-radius:100%}']}),p("design:paramtypes",[r.DomSanitizer,e.ChangeDetectorRef,e.NgZone])],t)}(),c=function(){function t(){}return t=s([e.NgModule({imports:[i.CommonModule],declarations:[h],exports:[h]})],t)}();t.ImageCropperComponent=h,t.ImageCropperModule=c,Object.defineProperty(t,"__esModule",{value:!0})}));
 //# sourceMappingURL=ngx-image-cropper.umd.min.js.map

fesm2015/ngx-image-cropper.js

@@ -461,6 +461,8 @@ import { __decorate, __metadata } from 'tslib';
     setMaxSize() {
-        const sourceImageElement = this.sourceImage.nativeElement;
-        this.maxSize.width = sourceImageElement.offsetWidth;
-        this.maxSize.height = sourceImageElement.offsetHeight;
-        this.marginLeft = this.sanitizer.bypassSecurityTrustStyle('calc(50% - ' + this.maxSize.width / 2 + 'px)');
+        if (this.sourceImage) {
+            const sourceImageElement = this.sourceImage.nativeElement;
+            this.maxSize.width = sourceImageElement.offsetWidth;
+            this.maxSize.height = sourceImageElement.offsetHeight;
+            this.marginLeft = this.sanitizer.bypassSecurityTrustStyle('calc(50% - ' + this.maxSize.width / 2 + 'px)');
+        }
     }
@@ -740,3 +742,3 @@ setCropperScaledMinSize() {
 __decorate([
-    ViewChild('sourceImage', { static: false }),
+    ViewChild('sourceImage', { static: true }),
     __metadata("design:type", ElementRef)
@@ -743,0 +745,0 @@ ], ImageCropperComponent.prototype, "sourceImage", void 0);

fesm5/ngx-image-cropper.js

@@ -481,6 +481,8 @@ import { __assign, __decorate, __metadata } from 'tslib';
     ImageCropperComponent.prototype.setMaxSize = function () {
-        var sourceImageElement = this.sourceImage.nativeElement;
-        this.maxSize.width = sourceImageElement.offsetWidth;
-        this.maxSize.height = sourceImageElement.offsetHeight;
-        this.marginLeft = this.sanitizer.bypassSecurityTrustStyle('calc(50% - ' + this.maxSize.width / 2 + 'px)');
+        if (this.sourceImage) {
+            var sourceImageElement = this.sourceImage.nativeElement;
+            this.maxSize.width = sourceImageElement.offsetWidth;
+            this.maxSize.height = sourceImageElement.offsetHeight;
+            this.marginLeft = this.sanitizer.bypassSecurityTrustStyle('calc(50% - ' + this.maxSize.width / 2 + 'px)');
+        }
     };
@@ -764,3 +766,3 @@ ImageCropperComponent.prototype.setCropperScaledMinSize = function () {
     __decorate([
-        ViewChild('sourceImage', { static: false }),
+        ViewChild('sourceImage', { static: true }),
         __metadata("design:type", ElementRef)
@@ -767,0 +769,0 @@ ], ImageCropperComponent.prototype, "sourceImage", void 0);

ngx-image-cropper.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":4,"exports":[{"export":[{"name":"CropperPosition","as":"CropperPosition"}],"from":"./src/cropper-position.interface"},{"export":[{"name":"ImageCroppedEvent","as":"ImageCroppedEvent"}],"from":"./src/image-cropped-event.interface"}],"metadata":{"ImageCropperModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":4,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":6,"character":8}],"declarations":[{"__symbolic":"reference","name":"ImageCropperComponent"}],"exports":[{"__symbolic":"reference","name":"ImageCropperComponent"}]}]}],"members":{}},"OutputType":{"__symbolic":"interface"},"ImageCropperComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"image-cropper","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":15,"character":21},"member":"OnPush"},"template":"<div [style.background]=\"imageVisible && backgroundColor\">\n    <img\n        #sourceImage\n        class=\"source-image\"\n        [src]=\"safeImgDataUrl\"\n        [style.visibility]=\"imageVisible ? 'visible' : 'hidden'\"\n        (load)=\"imageLoadedInView()\"\n    />\n    <div class=\"cropper\"\n         *ngIf=\"imageVisible\"\n         [class.rounded]=\"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    >\n        <div\n                (mousedown)=\"startMove($event, 'move')\"\n                (touchstart)=\"startMove($event, 'move')\"\n                class=\"move\"\n        >&nbsp;</div>\n        <span\n                class=\"resize topleft\"\n                (mousedown)=\"startMove($event, 'resize', 'topleft')\"\n                (touchstart)=\"startMove($event, 'resize', 'topleft')\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize top\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize topright\"\n                (mousedown)=\"startMove($event, 'resize', 'topright')\"\n                (touchstart)=\"startMove($event, 'resize', 'topright')\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize right\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize bottomright\"\n                (mousedown)=\"startMove($event, 'resize', 'bottomright')\"\n                (touchstart)=\"startMove($event, 'resize', 'bottomright')\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize bottom\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize bottomleft\"\n                (mousedown)=\"startMove($event, 'resize', 'bottomleft')\"\n                (touchstart)=\"startMove($event, 'resize', 'bottomleft')\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize left\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize-bar top\"\n                (mousedown)=\"startMove($event, 'resize', 'top')\"\n                (touchstart)=\"startMove($event, 'resize', 'top')\"\n        ></span>\n        <span\n                class=\"resize-bar right\"\n                (mousedown)=\"startMove($event, 'resize', 'right')\"\n                (touchstart)=\"startMove($event, 'resize', 'right')\"\n        ></span>\n        <span\n                class=\"resize-bar bottom\"\n                (mousedown)=\"startMove($event, 'resize', 'bottom')\"\n                (touchstart)=\"startMove($event, 'resize', 'bottom')\"\n        ></span>\n        <span\n                class=\"resize-bar left\"\n                (mousedown)=\"startMove($event, 'resize', 'left')\"\n                (touchstart)=\"startMove($event, 'resize', 'left')\"\n        ></span>\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;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host>div{position:relative;width:100%}:host>div img.source-image{max-width:100%;max-height:100%}:host .cropper{position:absolute;display:flex;color:#53535c;background:0 0;touch-action:none;outline:rgba(255,255,255,.3) solid 100vw}:host .cropper:after{position:absolute;content:\"\";top:0;bottom:0;left:0;right:0;pointer-events:none;border:1px dashed;opacity:.75;color:inherit;z-index:1}:host .cropper .move{width:100%;cursor:move;border:1px solid rgba(255,255,255,.5)}:host .cropper .resize{position:absolute;display:inline-block;line-height:6px;padding:8px;opacity:.85;z-index:1}:host .cropper .resize .square{display:inline-block;background:#53535c;width:6px;height:6px;border:1px solid rgba(255,255,255,.5);box-sizing:content-box}:host .cropper .resize.topleft{top:-12px;left:-12px;cursor:nwse-resize}:host .cropper .resize.top{top:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .cropper .resize.topright{top:-12px;right:-12px;cursor:nesw-resize}:host .cropper .resize.right{top:calc(50% - 12px);right:-12px;cursor:ew-resize}:host .cropper .resize.bottomright{bottom:-12px;right:-12px;cursor:nwse-resize}:host .cropper .resize.bottom{bottom:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .cropper .resize.bottomleft{bottom:-12px;left:-12px;cursor:nesw-resize}:host .cropper .resize.left{top:calc(50% - 12px);left:-12px;cursor:ew-resize}:host .cropper .resize-bar{position:absolute;z-index:1}:host .cropper .resize-bar.top{top:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .cropper .resize-bar.right{top:11px;right:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .cropper .resize-bar.bottom{bottom:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .cropper .resize-bar.left{top:11px;left:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .cropper.rounded{outline-color:transparent}:host .cropper.rounded:after{border-radius:100%;box-shadow:0 0 0 100vw rgba(255,255,255,.3)}@media (orientation:portrait){:host .cropper{outline-width:100vh}:host .cropper.rounded:after{box-shadow:0 0 0 100vh rgba(255,255,255,.3)}}:host .cropper.rounded .move{border-radius:100%}"]}]}],"members":{"sourceImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":31,"character":5},"arguments":["sourceImage",{"static":false}]}]}],"imageFileChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":5}}]}],"imageChangedEvent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":5}}]}],"imageBase64":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":49,"character":5}}]}],"format":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":5}}]}],"outputType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":5}}]}],"maintainAspectRatio":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":5}}]}],"aspectRatio":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":58,"character":5}}]}],"resizeToWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":59,"character":5}}]}],"resizeToHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":5}}]}],"cropperMinWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":5}}]}],"cropperMinHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":62,"character":5}}]}],"roundCropper":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":5}}]}],"onlyScaleDown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":64,"character":5}}]}],"imageQuality":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":65,"character":5}}]}],"autoCrop":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":66,"character":5}}]}],"backgroundColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":67,"character":5}}]}],"containWithinAspectRatio":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":68,"character":5}}]}],"cropper":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":69,"character":5}}]}],"alignImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":75,"character":5},"arguments":["style.text-align"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":76,"character":5}}]}],"startCropImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":79,"character":5}}]}],"imageCropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":80,"character":5}}]}],"imageCroppedBase64":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":81,"character":5}}]}],"imageCroppedFile":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":82,"character":5}}]}],"imageLoaded":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":83,"character":5}}]}],"cropperReady":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":84,"character":5}}]}],"loadImageFailed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":85,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/platform-browser","name":"DomSanitizer","line":87,"character":35},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":88,"character":28},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":89,"character":30}]}],"ngOnChanges":[{"__symbolic":"method"}],"initCropper":[{"__symbolic":"method"}],"loadImageFile":[{"__symbolic":"method"}],"isValidImageType":[{"__symbolic":"method"}],"checkExifAndLoadBase64Image":[{"__symbolic":"method"}],"fitImageToAspectRatio":[{"__symbolic":"method"}],"loadBase64Image":[{"__symbolic":"method"}],"imageLoadedInView":[{"__symbolic":"method"}],"checkImageMaxSizeRecursively":[{"__symbolic":"method"}],"onResize":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":204,"character":5},"arguments":["window:resize"]}]}],"rotateLeft":[{"__symbolic":"method"}],"rotateRight":[{"__symbolic":"method"}],"flipHorizontal":[{"__symbolic":"method"}],"flipVertical":[{"__symbolic":"method"}],"transformBase64":[{"__symbolic":"method"}],"resizeCropperPosition":[{"__symbolic":"method"}],"resetCropperPosition":[{"__symbolic":"method"}],"startMove":[{"__symbolic":"method"}],"moveImg":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":281,"character":5},"arguments":["document:mousemove",["$event"]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":282,"character":5},"arguments":["document:touchmove",["$event"]]}]}],"setMaxSize":[{"__symbolic":"method"}],"setCropperScaledMinSize":[{"__symbolic":"method"}],"setCropperScaledMinWidth":[{"__symbolic":"method"}],"setCropperScaledMinHeight":[{"__symbolic":"method"}],"checkCropperPosition":[{"__symbolic":"method"}],"moveStop":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":350,"character":5},"arguments":["document:mouseup"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":351,"character":5},"arguments":["document:touchend"]}]}],"move":[{"__symbolic":"method"}],"resize":[{"__symbolic":"method"}],"checkAspectRatio":[{"__symbolic":"method"}],"doAutoCrop":[{"__symbolic":"method"}],"crop":[{"__symbolic":"method"}],"getImagePosition":[{"__symbolic":"method"}],"cropToOutputType":[{"__symbolic":"method"}],"cropToBase64":[{"__symbolic":"method"}],"cropToFile":[{"__symbolic":"method"}],"getCanvasBlob":[{"__symbolic":"method"}],"getQuality":[{"__symbolic":"method"}],"getResizeRatio":[{"__symbolic":"method"}],"getClientX":[{"__symbolic":"method"}],"getClientY":[{"__symbolic":"method"}]}}},"origins":{"ImageCropperModule":"./src/image-cropper.module","OutputType":"./src/component/image-cropper.component","ImageCropperComponent":"./src/component/image-cropper.component"},"importAs":"ngx-image-cropper"}
+{"__symbolic":"module","version":4,"exports":[{"export":[{"name":"CropperPosition","as":"CropperPosition"}],"from":"./src/cropper-position.interface"},{"export":[{"name":"ImageCroppedEvent","as":"ImageCroppedEvent"}],"from":"./src/image-cropped-event.interface"}],"metadata":{"ImageCropperModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":4,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":6,"character":8}],"declarations":[{"__symbolic":"reference","name":"ImageCropperComponent"}],"exports":[{"__symbolic":"reference","name":"ImageCropperComponent"}]}]}],"members":{}},"OutputType":{"__symbolic":"interface"},"ImageCropperComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"image-cropper","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":15,"character":21},"member":"OnPush"},"template":"<div [style.background]=\"imageVisible && backgroundColor\">\n    <img\n        #sourceImage\n        class=\"source-image\"\n        [src]=\"safeImgDataUrl\"\n        [style.visibility]=\"imageVisible ? 'visible' : 'hidden'\"\n        (load)=\"imageLoadedInView()\"\n    />\n    <div class=\"cropper\"\n         *ngIf=\"imageVisible\"\n         [class.rounded]=\"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    >\n        <div\n                (mousedown)=\"startMove($event, 'move')\"\n                (touchstart)=\"startMove($event, 'move')\"\n                class=\"move\"\n        >&nbsp;</div>\n        <span\n                class=\"resize topleft\"\n                (mousedown)=\"startMove($event, 'resize', 'topleft')\"\n                (touchstart)=\"startMove($event, 'resize', 'topleft')\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize top\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize topright\"\n                (mousedown)=\"startMove($event, 'resize', 'topright')\"\n                (touchstart)=\"startMove($event, 'resize', 'topright')\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize right\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize bottomright\"\n                (mousedown)=\"startMove($event, 'resize', 'bottomright')\"\n                (touchstart)=\"startMove($event, 'resize', 'bottomright')\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize bottom\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize bottomleft\"\n                (mousedown)=\"startMove($event, 'resize', 'bottomleft')\"\n                (touchstart)=\"startMove($event, 'resize', 'bottomleft')\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize left\"\n        ><span class=\"square\"></span></span>\n        <span\n                class=\"resize-bar top\"\n                (mousedown)=\"startMove($event, 'resize', 'top')\"\n                (touchstart)=\"startMove($event, 'resize', 'top')\"\n        ></span>\n        <span\n                class=\"resize-bar right\"\n                (mousedown)=\"startMove($event, 'resize', 'right')\"\n                (touchstart)=\"startMove($event, 'resize', 'right')\"\n        ></span>\n        <span\n                class=\"resize-bar bottom\"\n                (mousedown)=\"startMove($event, 'resize', 'bottom')\"\n                (touchstart)=\"startMove($event, 'resize', 'bottom')\"\n        ></span>\n        <span\n                class=\"resize-bar left\"\n                (mousedown)=\"startMove($event, 'resize', 'left')\"\n                (touchstart)=\"startMove($event, 'resize', 'left')\"\n        ></span>\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;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host>div{position:relative;width:100%}:host>div img.source-image{max-width:100%;max-height:100%}:host .cropper{position:absolute;display:flex;color:#53535c;background:0 0;touch-action:none;outline:rgba(255,255,255,.3) solid 100vw}:host .cropper:after{position:absolute;content:\"\";top:0;bottom:0;left:0;right:0;pointer-events:none;border:1px dashed;opacity:.75;color:inherit;z-index:1}:host .cropper .move{width:100%;cursor:move;border:1px solid rgba(255,255,255,.5)}:host .cropper .resize{position:absolute;display:inline-block;line-height:6px;padding:8px;opacity:.85;z-index:1}:host .cropper .resize .square{display:inline-block;background:#53535c;width:6px;height:6px;border:1px solid rgba(255,255,255,.5);box-sizing:content-box}:host .cropper .resize.topleft{top:-12px;left:-12px;cursor:nwse-resize}:host .cropper .resize.top{top:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .cropper .resize.topright{top:-12px;right:-12px;cursor:nesw-resize}:host .cropper .resize.right{top:calc(50% - 12px);right:-12px;cursor:ew-resize}:host .cropper .resize.bottomright{bottom:-12px;right:-12px;cursor:nwse-resize}:host .cropper .resize.bottom{bottom:-12px;left:calc(50% - 12px);cursor:ns-resize}:host .cropper .resize.bottomleft{bottom:-12px;left:-12px;cursor:nesw-resize}:host .cropper .resize.left{top:calc(50% - 12px);left:-12px;cursor:ew-resize}:host .cropper .resize-bar{position:absolute;z-index:1}:host .cropper .resize-bar.top{top:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .cropper .resize-bar.right{top:11px;right:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .cropper .resize-bar.bottom{bottom:-11px;left:11px;width:calc(100% - 22px);height:22px;cursor:ns-resize}:host .cropper .resize-bar.left{top:11px;left:-11px;height:calc(100% - 22px);width:22px;cursor:ew-resize}:host .cropper.rounded{outline-color:transparent}:host .cropper.rounded:after{border-radius:100%;box-shadow:0 0 0 100vw rgba(255,255,255,.3)}@media (orientation:portrait){:host .cropper{outline-width:100vh}:host .cropper.rounded:after{box-shadow:0 0 0 100vh rgba(255,255,255,.3)}}:host .cropper.rounded .move{border-radius:100%}"]}]}],"members":{"sourceImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":31,"character":5},"arguments":["sourceImage",{"static":true}]}]}],"imageFileChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":5}}]}],"imageChangedEvent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":5}}]}],"imageBase64":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":49,"character":5}}]}],"format":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":5}}]}],"outputType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":5}}]}],"maintainAspectRatio":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":5}}]}],"aspectRatio":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":58,"character":5}}]}],"resizeToWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":59,"character":5}}]}],"resizeToHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":5}}]}],"cropperMinWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":5}}]}],"cropperMinHeight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":62,"character":5}}]}],"roundCropper":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":5}}]}],"onlyScaleDown":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":64,"character":5}}]}],"imageQuality":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":65,"character":5}}]}],"autoCrop":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":66,"character":5}}]}],"backgroundColor":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":67,"character":5}}]}],"containWithinAspectRatio":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":68,"character":5}}]}],"cropper":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":69,"character":5}}]}],"alignImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":75,"character":5},"arguments":["style.text-align"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":76,"character":5}}]}],"startCropImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":79,"character":5}}]}],"imageCropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":80,"character":5}}]}],"imageCroppedBase64":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":81,"character":5}}]}],"imageCroppedFile":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":82,"character":5}}]}],"imageLoaded":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":83,"character":5}}]}],"cropperReady":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":84,"character":5}}]}],"loadImageFailed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":85,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/platform-browser","name":"DomSanitizer","line":87,"character":35},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":88,"character":28},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":89,"character":30}]}],"ngOnChanges":[{"__symbolic":"method"}],"initCropper":[{"__symbolic":"method"}],"loadImageFile":[{"__symbolic":"method"}],"isValidImageType":[{"__symbolic":"method"}],"checkExifAndLoadBase64Image":[{"__symbolic":"method"}],"fitImageToAspectRatio":[{"__symbolic":"method"}],"loadBase64Image":[{"__symbolic":"method"}],"imageLoadedInView":[{"__symbolic":"method"}],"checkImageMaxSizeRecursively":[{"__symbolic":"method"}],"onResize":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":204,"character":5},"arguments":["window:resize"]}]}],"rotateLeft":[{"__symbolic":"method"}],"rotateRight":[{"__symbolic":"method"}],"flipHorizontal":[{"__symbolic":"method"}],"flipVertical":[{"__symbolic":"method"}],"transformBase64":[{"__symbolic":"method"}],"resizeCropperPosition":[{"__symbolic":"method"}],"resetCropperPosition":[{"__symbolic":"method"}],"startMove":[{"__symbolic":"method"}],"moveImg":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":281,"character":5},"arguments":["document:mousemove",["$event"]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":282,"character":5},"arguments":["document:touchmove",["$event"]]}]}],"setMaxSize":[{"__symbolic":"method"}],"setCropperScaledMinSize":[{"__symbolic":"method"}],"setCropperScaledMinWidth":[{"__symbolic":"method"}],"setCropperScaledMinHeight":[{"__symbolic":"method"}],"checkCropperPosition":[{"__symbolic":"method"}],"moveStop":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":352,"character":5},"arguments":["document:mouseup"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":353,"character":5},"arguments":["document:touchend"]}]}],"move":[{"__symbolic":"method"}],"resize":[{"__symbolic":"method"}],"checkAspectRatio":[{"__symbolic":"method"}],"doAutoCrop":[{"__symbolic":"method"}],"crop":[{"__symbolic":"method"}],"getImagePosition":[{"__symbolic":"method"}],"cropToOutputType":[{"__symbolic":"method"}],"cropToBase64":[{"__symbolic":"method"}],"cropToFile":[{"__symbolic":"method"}],"getCanvasBlob":[{"__symbolic":"method"}],"getQuality":[{"__symbolic":"method"}],"getResizeRatio":[{"__symbolic":"method"}],"getClientX":[{"__symbolic":"method"}],"getClientY":[{"__symbolic":"method"}]}}},"origins":{"ImageCropperModule":"./src/image-cropper.module","OutputType":"./src/component/image-cropper.component","ImageCropperComponent":"./src/component/image-cropper.component"},"importAs":"ngx-image-cropper"}

package.json

 {
   "name": "ngx-image-cropper",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "An image cropper for Angular",
@@ -5,0 +5,0 @@ "main": "bundles/ngx-image-cropper.umd.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

767227

increased by0.12%

Lines of code

5088

increased by0.2%

No dependency changes