angular-upcrop - npm Package Compare versions

Comparing version 0.1.4 to 0.1.5

angular-upcrop.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":3,"metadata":{"AngularUpcropModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"},{"__symbolic":"reference","module":"ng2-file-upload","name":"FileUploadModule"},{"__symbolic":"reference","module":"@angular/flex-layout","name":"FlexLayoutModule"},{"__symbolic":"reference","module":"@angular/material","name":"MatCardModule"},{"__symbolic":"reference","module":"@angular/material","name":"MatIconModule"},{"__symbolic":"reference","module":"@angular/material","name":"MatButtonModule"},{"__symbolic":"reference","module":"@angular/material","name":"MatDialogModule"},{"__symbolic":"reference","module":"@angular/material","name":"MatTooltipModule"},{"__symbolic":"reference","module":"angular-cropperjs","name":"AngularCropperjsModule"}],"declarations":[{"__symbolic":"reference","name":"UpcropUploadComponent"},{"__symbolic":"reference","name":"UpcropCropComponent"},{"__symbolic":"reference","name":"UpcropDialogComponent"},{"__symbolic":"reference","name":"UpcropImagePreviewDirective"}],"exports":[{"__symbolic":"reference","name":"UpcropUploadComponent"},{"__symbolic":"reference","name":"UpcropCropComponent"},{"__symbolic":"reference","name":"UpcropDialogComponent"},{"__symbolic":"reference","name":"UpcropImagePreviewDirective"}],"entryComponents":[{"__symbolic":"reference","name":"UpcropDialogComponent"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"AngularUpcropModule"}}}}},"UpcropUploadComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"app-upcrop-upload","template":"<label ng2FileDrop multiple class=\"my-drop-zone\" [ngClass]=\"{'nv-file-over': hasFileOver}\" (fileOver)=\"onFileOver($event)\" [uploader]=\"uploader\" fxLayout fxLayoutAlign=\"center center\"> Área de upload <input type=\"file\" ng2FileSelect multiple [uploader]=\"uploader\" style=\"display: none\"/></label><table class=\"table upcrop-upload-table\"> <thead> <tr> <th>Preview</th> <th>Arquivo</th> <th> <md-icon class=\"is-pulled-right\">settings</md-icon> </th> </tr></thead> <tbody> <tr *ngFor=\"let item of uploader.queue\"> <td style=\"width:120px\"> <img upcropImagePreview [image]=\"item?._file\" class=\"media-object\"/> </td><td>{{truncate(item?.file?.name, 16)}}</td><td class=\"actions\" style=\"width:53px\"> <a class=\"button is-small is-danger is-outlined\" (click)=\"item.remove()\"> <span class=\"icon is-small\"> <i class=\"fa fa-trash\"></i> </span> </a> </td></tr><tr [hidden]=\"uploader.queue.length\"> <td colspan=\"3\" class=\"has-text-danger\"> Nenhum arquivo, adicione acima. </td></tr></tbody></table>","styles":[".my-drop-zone{border:2px dashed rgba(0,0,0,.04);width:100%;display:flex;padding:20px;background-color:rgba(0,0,0,.04);color:rgba(0,0,0,.7)}.nv-file-over{border:2px dashed rgba(244,67,54,.4)}[upcropImagePreview]{display:block}.upcrop-upload-table{background-color:#fff;color:#363636}.upcrop-upload-table td,.upcrop-upload-table th{border:1px solid #dbdbdb;border-width:0 0 1px;padding:.5em .75em;vertical-align:top}.upcrop-upload-table td.is-white,.upcrop-upload-table th.is-white{background-color:#fff;border-color:#fff;color:#0a0a0a}.upcrop-upload-table td.is-black,.upcrop-upload-table th.is-black{background-color:#0a0a0a;border-color:#0a0a0a;color:#fff}.upcrop-upload-table td.is-light,.upcrop-upload-table th.is-light{background-color:#f5f5f5;border-color:#f5f5f5;color:#363636}.upcrop-upload-table td.is-dark,.upcrop-upload-table th.is-dark{background-color:#363636;border-color:#363636;color:#f5f5f5}.upcrop-upload-table td.is-primary,.upcrop-upload-table th.is-primary{background-color:#00d1b2;border-color:#00d1b2;color:#fff}.upcrop-upload-table td.is-info,.upcrop-upload-table th.is-info{background-color:#3273dc;border-color:#3273dc;color:#fff}.upcrop-upload-table td.is-success,.upcrop-upload-table th.is-success{background-color:#23d160;border-color:#23d160;color:#fff}.upcrop-upload-table td.is-warning,.upcrop-upload-table th.is-warning{background-color:#ffdd57;border-color:#ffdd57;color:rgba(0,0,0,.7)}.upcrop-upload-table td.is-danger,.upcrop-upload-table th.is-danger{background-color:#ff3860;border-color:#ff3860;color:#fff}.upcrop-upload-table td.is-narrow,.upcrop-upload-table th.is-narrow{white-space:nowrap;width:1%}.upcrop-upload-table th{color:#363636;text-align:left}.upcrop-upload-table tr:hover{background-color:#fafafa}.upcrop-upload-table tr.is-selected{background-color:#00d1b2;color:#fff}.upcrop-upload-table tr.is-selected a,.upcrop-upload-table tr.is-selected strong{color:currentColor}.upcrop-upload-table tr.is-selected td,.upcrop-upload-table tr.is-selected th{border-color:#fff;color:currentColor}.upcrop-upload-table thead td,.upcrop-upload-table thead th{color:#363636}.upcrop-upload-table tfoot td,.upcrop-upload-table tfoot th{border-width:2px 0 0;color:#363636}.upcrop-upload-table tbody tr:last-child td,.upcrop-upload-table tbody tr:last-child th{border-bottom-width:0}.upcrop-upload-table.is-bordered td,.upcrop-upload-table.is-bordered th{border-width:1px}.upcrop-upload-table.is-bordered tr:last-child td,.upcrop-upload-table.is-bordered tr:last-child th{border-bottom-width:1px}.upcrop-upload-table.is-fullwidth{width:100%}.upcrop-upload-table.is-narrow td,.upcrop-upload-table.is-narrow th{padding:.25em .5em}.upcrop-upload-table.is-striped tbody tr:not(.is-selected):nth-child(even){background-color:#fafafa}.upcrop-upload-table.is-striped tbody tr:not(.is-selected):nth-child(even):hover{background-color:#f5f5f5}td,th{padding:0;text-align:left}.upcrop-upload-table-search{display:flex;padding:1.3em 1.6em}.upcrop-upload-table-search input{font-size:14px;flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1;border:none;background-color:transparent;outline:-webkit-focus-ring-color auto 0!important}.upcrop-upload-table-search>md-icon{margin-right:16px;margin-top:2px}[table-loading]{position:absolute;width:100%;margin-top:59px!important;background-color:rgba(255,255,255,.9);height:calc(100% - 59px);z-index:1}[table-no-entries]{padding:1.6em}.mat-card[has-table]{padding:0}.mat-card[has-table] .mat-card-actions{padding:8px!important;margin:0;border-top:1px solid #dbdbdb;border-color:rgba(0,0,0,.09)}.mat-card[has-table] .mat-card-actions .mat-icon-button{color:rgba(0,0,0,.54)}.mat-card[has-table] .mat-card-actions .mat-icon-button[disabled]{color:rgba(0,0,0,.18)}.mat-card[has-table] .mat-card-actions .mat-paginator-page-size-label{margin:0 15px;color:rgba(0,0,0,.54);font-size:12px;font-weight:400}.upcrop-upload-table{border-collapse:collapse;border-spacing:0;width:100%;margin-bottom:0}.upcrop-upload-table .actions .button{margin-bottom:-.25em;margin-top:-.15em}.upcrop-upload-table thead tr{background-color:rgba(0,0,0,.04)!important}.upcrop-upload-table thead td:first-of-type,.upcrop-upload-table thead th:first-of-type{padding-left:1.8em}.upcrop-upload-table thead td:last-of-type,.upcrop-upload-table thead th:last-of-type{padding-right:1.8em}.upcrop-upload-table thead td md-icon,.upcrop-upload-table thead th md-icon{height:16px;width:16px;line-height:16px;font-size:16px;vertical-align:bottom;margin-right:3px}.upcrop-upload-table tbody td,.upcrop-upload-table tbody th{border-color:rgba(0,0,0,.04)}.upcrop-upload-table tbody td:first-of-type,.upcrop-upload-table tbody th:first-of-type{padding-left:1.6em}.upcrop-upload-table tbody td:last-of-type,.upcrop-upload-table tbody th:last-of-type{padding-right:1.6em}.upcrop-upload-table thead td,.upcrop-upload-table thead th{color:rgba(0,0,0,.54);font-size:12px;font-weight:400;padding:1.3em .75em;border:none;border-width:0}.upcrop-upload-table tbody td{color:rgba(0,0,0,.87);padding:1em .75em;font-size:.9rem;font-weight:400}@media (max-width:800px){.upcrop-upload-table{vertical-align:top;max-width:100%;overflow-x:auto;white-space:nowrap;border-collapse:collapse;border-spacing:0;display:flex;overflow:hidden;background:0 0}.upcrop-upload-table .actions a{margin-top:-.35em}.upcrop-upload-table .is-pulled-right{float:none!important}.upcrop-upload-table thead{display:flex;flex-shrink:0;min-width:min-content}.upcrop-upload-table thead td,.upcrop-upload-table thead th{padding:1.3em 1.8em;text-align:right;width:100%!important}.upcrop-upload-table thead td md-icon,.upcrop-upload-table thead th md-icon{margin-right:0}.upcrop-upload-table tbody{flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1;-webkit-overflow-scrolling:touch;background:radial-gradient(left,ellipse,rgba(0,0,0,.2) 0,transparent 75%) 0 center,radial-gradient(right,ellipse,rgba(0,0,0,.2) 0,transparent 75%) 100% center;background-size:10px 100%,10px 100%;background-attachment:scroll,scroll;background-repeat:no-repeat;display:flex;position:relative;overflow-x:auto;overflow-y:hidden;margin-right:1.6em}.upcrop-upload-table tbody tr{flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1}.upcrop-upload-table tbody td,.upcrop-upload-table tbody th{padding:1.155em 1.6em;text-align:left!important}.upcrop-upload-table tbody td:first-of-type,.upcrop-upload-table tbody th:first-of-type{padding-left:1.6em}.upcrop-upload-table tbody td:last-of-type,.upcrop-upload-table tbody th:last-of-type{padding-right:1.6em}.upcrop-upload-table tr{display:flex;flex-direction:column;min-width:min-content;flex-shrink:0}.upcrop-upload-table td,.upcrop-upload-table th{display:block;background-image:none!important;border-left:0}.upcrop-upload-table td:first-child,.upcrop-upload-table th:first-child{background-image:linear-gradient(to right,#fff 50%,rgba(255,255,255,0) 100%);background-repeat:no-repeat;background-size:20px 100%}.upcrop-upload-table td:last-child,.upcrop-upload-table th:last-child{background-image:linear-gradient(to left,#fff 50%,rgba(255,255,255,0) 100%);background-repeat:no-repeat;background-position:100% 0;background-size:20px 100%}.upcrop-upload-table td:not(:last-child),.upcrop-upload-table th:not(:last-child){border-bottom:0}}.upcrop-upload-table ::-webkit-scrollbar{height:8px;overflow:visible;width:16px}.upcrop-upload-table ::-webkit-scrollbar-button{height:0;width:0}.upcrop-upload-table ::-webkit-scrollbar-corner{background:0 0}.upcrop-upload-table ::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.2);background-clip:padding-box;border:solid transparent;border-width:1px 1px 1px 6px;min-height:28px;padding:100px 0 0;-webkit-box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07);box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07)}.upcrop-upload-table ::-webkit-scrollbar-track{background-clip:padding-box;border:solid transparent;border-width:0 0 0 4px}[enterlist] [has-table]{margin-right:-24px;margin-left:-24px}[enterlist] [has-table] .upcrop-upload-table{background-color:transparent}[enterlist] [has-table] .upcrop-upload-table thead tr{background-color:rgba(0,0,0,.02)!important}[enterlist] [has-table] .upcrop-upload-table tr:hover{background-color:inherit}"]}]}],"members":{"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"uploadQueue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onUploadQueue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onUploadImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"setUploader":[{"__symbolic":"method"}],"onFileOver":[{"__symbolic":"method"}],"truncate":[{"__symbolic":"method"}]}},"UpcropCropComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"app-upcrop-crop","template":"<div main-loading [fxHide]=\"!uploading\"> <div class=\"spinner\"></div></div><div [hidden]=\"uploading\" class=\"upcrop-crop\"> <h2 class=\"has-text-centered mat-subheading-2\">Imagem{{currentNumber + 1}}de{{uploader?.queue?.length}}</h2> <div class=\"crop-image-container\"> <angular-cropper #angularCropper *ngIf=\"current && current._dataUrl\" [cropperOptions]=\"config\" [imageUrl]=\"current?._dataUrl\"></angular-cropper> </div><div class=\"crop-controls\" fxLayout fxLayoutAlign=\"center center\" fxLayoutWrap *ngIf=\"current && current._dataUrl\"> <button md-button (click)=\"zoomIn()\" class=\"md-icon-button\" aria-label=\"Aumentar zoom\" mdTooltip=\"Aumentar zoom\"> <md-icon>zoom_in</md-icon> </button> <button md-button (click)=\"zoomOut()\" class=\"md-icon-button\" aria-label=\"Diminuir zoom\" mdTooltip=\"Diminuir zoom\"> <md-icon>zoom_out</md-icon> </button> <button md-button (click)=\"goLeft()\" class=\"md-icon-button\" aria-label=\"Mover para esquerda\" mdTooltip=\"Mover para esquerda\"> <md-icon>keyboard_arrow_left</md-icon> </button> <button md-button (click)=\"goRight()\" class=\"md-icon-button\" aria-label=\"Mover para direita\" mdTooltip=\"Mover para direita\"> <md-icon>keyboard_arrow_right</md-icon> </button> <button md-button (click)=\"goUp()\" class=\"md-icon-button\" aria-label=\"Mover para cima\" mdTooltip=\"Mover para cima\"> <md-icon>keyboard_arrow_up</md-icon> </button> <button md-button (click)=\"goDown()\" class=\"md-icon-button\" aria-label=\"Mover para baixo\" mdTooltip=\"Mover para baixo\"> <md-icon>keyboard_arrow_down</md-icon> </button> <button md-button (click)=\"reset()\" class=\"md-icon-button md-primary\" aria-label=\"Restaurar imagem original\" mdTooltip=\"Restaurar imagem original\"> <md-icon>cached</md-icon> </button> </div></div>","styles":[".crop-image-container{max-height:500px;width:100%}.crop-image-container img{max-width:100%;max-height:100%}.crop-controls{padding-top:20px;padding-bottom:20px}[main-loading]{min-height:120px;padding-top:34px;box-sizing:border-box;flex-direction:column;max-width:100%;place-content:center;align-items:center;display:flex}.upcrop-crop .has-text-centered{text-align:center!important}"]}]}],"members":{"angularCropper":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["angularCropper"]}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"uploader":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onCropImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"setCropping":[{"__symbolic":"method"}],"unsetCropping":[{"__symbolic":"method"}],"goToNextCrop":[{"__symbolic":"method"}],"emitOnCropImage":[{"__symbolic":"method"}],"zoomIn":[{"__symbolic":"method"}],"zoomOut":[{"__symbolic":"method"}],"goLeft":[{"__symbolic":"method"}],"goRight":[{"__symbolic":"method"}],"goUp":[{"__symbolic":"method"}],"goDown":[{"__symbolic":"method"}],"rotateLeft":[{"__symbolic":"method"}],"rotateRight":[{"__symbolic":"method"}],"reset":[{"__symbolic":"method"}]}},"UpcropDialogComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"app-upcrop-dialog","template":"<h2 md-dialog-title class=\"has-text-danger\"> Upload de imagens <small>com corte</small></h2><md-dialog-content> <div steps> <div steps-content fxLayout=\"row\" fxLayoutAlign=\"start center\"> <button md-icon-button fxHide.xs [disabled]=\"!steps.current.previus || (steps.current.previusDisabled && steps.current.previusDisabled())\" (click)=\"steps.current.previusAction()\"> <md-icon>keyboard_arrow_left</md-icon> </button> <span fxFlex></span> <h3>Passo <b>{{steps.current.number}}</b> de <b>{{steps.total}}</b> / <span class=\"has-text-primary\">{{steps.current.label}}</span> </h3> <span fxFlex></span> <button md-icon-button fxHide.xs [disabled]=\"!steps.current.next || (steps.current.nextDisabled && steps.current.nextDisabled())\" (click)=\"steps.current.nextAction()\"> <md-icon>keyboard_arrow_right</md-icon> </button> </div></div><div class=\"step-1\" [hidden]=\"steps.current.number !=1\"> <app-upcrop-upload #upcropUpload [config]=\"data.uploadConfig\" (onUploadImage)=\"onUploadImage($event)\"></app-upcrop-upload> </div><div class=\"step-2\" [hidden]=\"steps.current.number !=2\"> <app-upcrop-crop #upcropCrop [config]=\"data.cropConfig\" (onCropImage)=\"onCropImage($event)\"></app-upcrop-crop> </div></md-dialog-content><md-dialog-actions *ngIf=\"steps.current.number==1\"> <button md-button md-dialog-close>Fechar</button> <button md-button color=\"primary\" [disabled]=\"!upcropUpload.uploader.queue.length\" (click)=\"goToStep2()\">Continuar</button></md-dialog-actions><md-dialog-actions *ngIf=\"steps.current.number==2\"> <button md-button (click)=\"goToStep1()\">Voltar</button> <button md-button color=\"primary\" [fxHide]=\"upcropCrop.uploader?.queue?.length==(upcropCrop.currentNumber + 1)\" (click)=\"upcropCrop.goToNextCrop()\">Próxima imagem</button> <button md-button color=\"primary\" [fxHide]=\"upcropCrop.uploader?.queue?.length > (upcropCrop.currentNumber + 1)\" [disabled]=\"upcropCrop.uploading\" (click)=\"finish()\">Concluir</button></md-dialog-actions>","styles":["[md-dialog-title] small{color:#b5b5b5!important;font:400 16px/28px Roboto,\"Helvetica Neue\",sans-serif!important;margin:0 0 16px!important}[steps]{margin:0 -24px 16px;padding-top:16px;padding-bottom:16px;background-color:rgba(0,0,0,.04)}[steps] .has-text-primary{color:#3f51b5!important}[md-dialog-title] .has-text-danger{color:#f44336!important}"]}]}],"members":{"upcropUpload":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["upcropUpload"]}]}],"upcropCrop":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["upcropCrop"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject"},"arguments":[{"__symbolic":"reference","module":"@angular/material","name":"MAT_DIALOG_DATA"}]}]],"parameters":[{"__symbolic":"reference","name":"MatDialogRef","module":"@angular/material","arguments":[{"__symbolic":"reference","name":"UpcropDialogComponent"}]},{"__symbolic":"reference","name":"any"}]}],"ngOnInit":[{"__symbolic":"method"}],"goToStep1":[{"__symbolic":"method"}],"goToStep2":[{"__symbolic":"method"}],"finish":[{"__symbolic":"method"}],"step1NextDisabled":[{"__symbolic":"method"}],"onCropImage":[{"__symbolic":"method"}],"onUploadImage":[{"__symbolic":"method"}],"createUrlParams":[{"__symbolic":"method"}]}},"UpcropImagePreviewDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"img[upcropImagePreview]"}]}],"members":{"image":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer"}]}],"ngOnChanges":[{"__symbolic":"method"}]}},"UpcropService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable"}}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/material","name":"MatDialog"}]}],"open":[{"__symbolic":"method"}]}}},"origins":{"AngularUpcropModule":"./index","UpcropUploadComponent":"./upcrop-upload/upcrop-upload.component","UpcropCropComponent":"./upcrop-crop/upcrop-crop.component","UpcropDialogComponent":"./upcrop-dialog/upcrop-dialog.component","UpcropImagePreviewDirective":"./upcrop-image-preview/upcrop-image-preview.directive","UpcropService":"./upcrop/upcrop.service"},"importAs":"angular-upcrop"}
+{"__symbolic":"module","version":3,"metadata":{"AngularUpcropModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"},{"__symbolic":"reference","module":"ng2-file-upload","name":"FileUploadModule"},{"__symbolic":"reference","module":"@angular/flex-layout","name":"FlexLayoutModule"},{"__symbolic":"reference","module":"@angular/material","name":"MatCardModule"},{"__symbolic":"reference","module":"@angular/material","name":"MatIconModule"},{"__symbolic":"reference","module":"@angular/material","name":"MatButtonModule"},{"__symbolic":"reference","module":"@angular/material","name":"MatDialogModule"},{"__symbolic":"reference","module":"@angular/material","name":"MatTooltipModule"},{"__symbolic":"reference","module":"angular-cropperjs","name":"AngularCropperjsModule"}],"declarations":[{"__symbolic":"reference","name":"UpcropUploadComponent"},{"__symbolic":"reference","name":"UpcropCropComponent"},{"__symbolic":"reference","name":"UpcropDialogComponent"},{"__symbolic":"reference","name":"UpcropImagePreviewDirective"}],"exports":[{"__symbolic":"reference","name":"UpcropUploadComponent"},{"__symbolic":"reference","name":"UpcropCropComponent"},{"__symbolic":"reference","name":"UpcropDialogComponent"},{"__symbolic":"reference","name":"UpcropImagePreviewDirective"}],"entryComponents":[{"__symbolic":"reference","name":"UpcropDialogComponent"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"AngularUpcropModule"}}}}},"UpcropUploadComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"app-upcrop-upload","template":"<label ng2FileDrop multiple class=\"my-drop-zone\" [ngClass]=\"{'nv-file-over': hasFileOver}\" (fileOver)=\"onFileOver($event)\" [uploader]=\"uploader\" fxLayout fxLayoutAlign=\"center center\"> Área de upload <input type=\"file\" ng2FileSelect multiple [uploader]=\"uploader\" style=\"display: none\"/></label><table class=\"table upcrop-upload-table\"> <thead> <tr> <th>Preview</th> <th>Arquivo</th> <th> <mat-icon class=\"is-pulled-right\">settings</mat-icon> </th> </tr></thead> <tbody> <tr *ngFor=\"let item of uploader.queue\"> <td style=\"width:120px\"> <img upcropImagePreview [image]=\"item?._file\" class=\"media-object\"/> </td><td>{{truncate(item?.file?.name, 16)}}</td><td class=\"actions\" style=\"width:53px\"> <a class=\"button is-small is-danger is-outlined\" (click)=\"item.remove()\"> <span class=\"icon is-small\"> <i class=\"fa fa-trash\"></i> </span> </a> </td></tr><tr [hidden]=\"uploader.queue.length\"> <td colspan=\"3\" class=\"has-text-danger\"> Nenhum arquivo, adicione acima. </td></tr></tbody></table>","styles":[".my-drop-zone{border:2px dashed rgba(0,0,0,.04);width:100%;display:flex;padding:20px;background-color:rgba(0,0,0,.04);color:rgba(0,0,0,.7)}.nv-file-over{border:2px dashed rgba(244,67,54,.4)}[upcropImagePreview]{display:block}.upcrop-upload-table{background-color:#fff;color:#363636}.upcrop-upload-table td,.upcrop-upload-table th{border:1px solid #dbdbdb;border-width:0 0 1px;padding:.5em .75em;vertical-align:top}.upcrop-upload-table td.is-white,.upcrop-upload-table th.is-white{background-color:#fff;border-color:#fff;color:#0a0a0a}.upcrop-upload-table td.is-black,.upcrop-upload-table th.is-black{background-color:#0a0a0a;border-color:#0a0a0a;color:#fff}.upcrop-upload-table td.is-light,.upcrop-upload-table th.is-light{background-color:#f5f5f5;border-color:#f5f5f5;color:#363636}.upcrop-upload-table td.is-dark,.upcrop-upload-table th.is-dark{background-color:#363636;border-color:#363636;color:#f5f5f5}.upcrop-upload-table td.is-primary,.upcrop-upload-table th.is-primary{background-color:#00d1b2;border-color:#00d1b2;color:#fff}.upcrop-upload-table td.is-info,.upcrop-upload-table th.is-info{background-color:#3273dc;border-color:#3273dc;color:#fff}.upcrop-upload-table td.is-success,.upcrop-upload-table th.is-success{background-color:#23d160;border-color:#23d160;color:#fff}.upcrop-upload-table td.is-warning,.upcrop-upload-table th.is-warning{background-color:#ffdd57;border-color:#ffdd57;color:rgba(0,0,0,.7)}.upcrop-upload-table td.is-danger,.upcrop-upload-table th.is-danger{background-color:#ff3860;border-color:#ff3860;color:#fff}.upcrop-upload-table td.is-narrow,.upcrop-upload-table th.is-narrow{white-space:nowrap;width:1%}.upcrop-upload-table th{color:#363636;text-align:left}.upcrop-upload-table tr:hover{background-color:#fafafa}.upcrop-upload-table tr.is-selected{background-color:#00d1b2;color:#fff}.upcrop-upload-table tr.is-selected a,.upcrop-upload-table tr.is-selected strong{color:currentColor}.upcrop-upload-table tr.is-selected td,.upcrop-upload-table tr.is-selected th{border-color:#fff;color:currentColor}.upcrop-upload-table thead td,.upcrop-upload-table thead th{color:#363636}.upcrop-upload-table tfoot td,.upcrop-upload-table tfoot th{border-width:2px 0 0;color:#363636}.upcrop-upload-table tbody tr:last-child td,.upcrop-upload-table tbody tr:last-child th{border-bottom-width:0}.upcrop-upload-table.is-bordered td,.upcrop-upload-table.is-bordered th{border-width:1px}.upcrop-upload-table.is-bordered tr:last-child td,.upcrop-upload-table.is-bordered tr:last-child th{border-bottom-width:1px}.upcrop-upload-table.is-fullwidth{width:100%}.upcrop-upload-table.is-narrow td,.upcrop-upload-table.is-narrow th{padding:.25em .5em}.upcrop-upload-table.is-striped tbody tr:not(.is-selected):nth-child(even){background-color:#fafafa}.upcrop-upload-table.is-striped tbody tr:not(.is-selected):nth-child(even):hover{background-color:#f5f5f5}td,th{padding:0;text-align:left}.upcrop-upload-table-search{display:flex;padding:1.3em 1.6em}.upcrop-upload-table-search input{font-size:14px;flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1;border:none;background-color:transparent;outline:-webkit-focus-ring-color auto 0!important}.upcrop-upload-table-search>mat-icon{margin-right:16px;margin-top:2px}[table-loading]{position:absolute;width:100%;margin-top:59px!important;background-color:rgba(255,255,255,.9);height:calc(100% - 59px);z-index:1}[table-no-entries]{padding:1.6em}.mat-card[has-table]{padding:0}.mat-card[has-table] .mat-card-actions{padding:8px!important;margin:0;border-top:1px solid #dbdbdb;border-color:rgba(0,0,0,.09)}.mat-card[has-table] .mat-card-actions .mat-icon-button{color:rgba(0,0,0,.54)}.mat-card[has-table] .mat-card-actions .mat-icon-button[disabled]{color:rgba(0,0,0,.18)}.mat-card[has-table] .mat-card-actions .mat-paginator-page-size-label{margin:0 15px;color:rgba(0,0,0,.54);font-size:12px;font-weight:400}.upcrop-upload-table{border-collapse:collapse;border-spacing:0;width:100%;margin-bottom:0}.upcrop-upload-table .actions .button{margin-bottom:-.25em;margin-top:-.15em}.upcrop-upload-table thead tr{background-color:rgba(0,0,0,.04)!important}.upcrop-upload-table thead td:first-of-type,.upcrop-upload-table thead th:first-of-type{padding-left:1.8em}.upcrop-upload-table thead td:last-of-type,.upcrop-upload-table thead th:last-of-type{padding-right:1.8em}.upcrop-upload-table thead td mat-icon,.upcrop-upload-table thead th mat-icon{height:16px;width:16px;line-height:16px;font-size:16px;vertical-align:bottom;margin-right:3px}.upcrop-upload-table tbody td,.upcrop-upload-table tbody th{border-color:rgba(0,0,0,.04)}.upcrop-upload-table tbody td:first-of-type,.upcrop-upload-table tbody th:first-of-type{padding-left:1.6em}.upcrop-upload-table tbody td:last-of-type,.upcrop-upload-table tbody th:last-of-type{padding-right:1.6em}.upcrop-upload-table thead td,.upcrop-upload-table thead th{color:rgba(0,0,0,.54);font-size:12px;font-weight:400;padding:1.3em .75em;border:none;border-width:0}.upcrop-upload-table tbody td{color:rgba(0,0,0,.87);padding:1em .75em;font-size:.9rem;font-weight:400}@media (max-width:800px){.upcrop-upload-table{vertical-align:top;max-width:100%;overflow-x:auto;white-space:nowrap;border-collapse:collapse;border-spacing:0;display:flex;overflow:hidden;background:0 0}.upcrop-upload-table .actions a{margin-top:-.35em}.upcrop-upload-table .is-pulled-right{float:none!important}.upcrop-upload-table thead{display:flex;flex-shrink:0;min-width:min-content}.upcrop-upload-table thead td,.upcrop-upload-table thead th{padding:1.3em 1.8em;text-align:right;width:100%!important}.upcrop-upload-table thead td mat-icon,.upcrop-upload-table thead th mat-icon{margin-right:0}.upcrop-upload-table tbody{flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1;-webkit-overflow-scrolling:touch;background:radial-gradient(left,ellipse,rgba(0,0,0,.2) 0,transparent 75%) 0 center,radial-gradient(right,ellipse,rgba(0,0,0,.2) 0,transparent 75%) 100% center;background-size:10px 100%,10px 100%;background-attachment:scroll,scroll;background-repeat:no-repeat;display:flex;position:relative;overflow-x:auto;overflow-y:hidden;margin-right:1.6em}.upcrop-upload-table tbody tr{flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1}.upcrop-upload-table tbody td,.upcrop-upload-table tbody th{padding:1.155em 1.6em;text-align:left!important}.upcrop-upload-table tbody td:first-of-type,.upcrop-upload-table tbody th:first-of-type{padding-left:1.6em}.upcrop-upload-table tbody td:last-of-type,.upcrop-upload-table tbody th:last-of-type{padding-right:1.6em}.upcrop-upload-table tr{display:flex;flex-direction:column;min-width:min-content;flex-shrink:0}.upcrop-upload-table td,.upcrop-upload-table th{display:block;background-image:none!important;border-left:0}.upcrop-upload-table td:first-child,.upcrop-upload-table th:first-child{background-image:linear-gradient(to right,#fff 50%,rgba(255,255,255,0) 100%);background-repeat:no-repeat;background-size:20px 100%}.upcrop-upload-table td:last-child,.upcrop-upload-table th:last-child{background-image:linear-gradient(to left,#fff 50%,rgba(255,255,255,0) 100%);background-repeat:no-repeat;background-position:100% 0;background-size:20px 100%}.upcrop-upload-table td:not(:last-child),.upcrop-upload-table th:not(:last-child){border-bottom:0}}.upcrop-upload-table ::-webkit-scrollbar{height:8px;overflow:visible;width:16px}.upcrop-upload-table ::-webkit-scrollbar-button{height:0;width:0}.upcrop-upload-table ::-webkit-scrollbar-corner{background:0 0}.upcrop-upload-table ::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.2);background-clip:padding-box;border:solid transparent;border-width:1px 1px 1px 6px;min-height:28px;padding:100px 0 0;-webkit-box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07);box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07)}.upcrop-upload-table ::-webkit-scrollbar-track{background-clip:padding-box;border:solid transparent;border-width:0 0 0 4px}[enterlist] [has-table]{margin-right:-24px;margin-left:-24px}[enterlist] [has-table] .upcrop-upload-table{background-color:transparent}[enterlist] [has-table] .upcrop-upload-table thead tr{background-color:rgba(0,0,0,.02)!important}[enterlist] [has-table] .upcrop-upload-table tr:hover{background-color:inherit}"]}]}],"members":{"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"uploadQueue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onUploadQueue":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onUploadImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"setUploader":[{"__symbolic":"method"}],"onFileOver":[{"__symbolic":"method"}],"truncate":[{"__symbolic":"method"}]}},"UpcropCropComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"app-upcrop-crop","template":"<div main-loading [fxHide]=\"!uploading\"> <div class=\"spinner\"></div></div><div [hidden]=\"uploading\" class=\"upcrop-crop\"> <h2 class=\"has-text-centered mat-subheading-2\">Imagem{{currentNumber + 1}}de{{uploader?.queue?.length}}</h2> <div class=\"crop-image-container\"> <angular-cropper #angularCropper *ngIf=\"current && current._dataUrl\" [cropperOptions]=\"config\" [imageUrl]=\"current?._dataUrl\"></angular-cropper> </div><div class=\"crop-controls\" fxLayout fxLayoutAlign=\"center center\" fxLayoutWrap *ngIf=\"current && current._dataUrl\"> <button mat-button (click)=\"zoomIn()\" class=\"mat-icon-button\" aria-label=\"Aumentar zoom\" mdTooltip=\"Aumentar zoom\"> <mat-icon>zoom_in</mat-icon> </button> <button mat-button (click)=\"zoomOut()\" class=\"mat-icon-button\" aria-label=\"Diminuir zoom\" mdTooltip=\"Diminuir zoom\"> <mat-icon>zoom_out</mat-icon> </button> <button mat-button (click)=\"goLeft()\" class=\"mat-icon-button\" aria-label=\"Mover para esquerda\" mdTooltip=\"Mover para esquerda\"> <mat-icon>keyboard_arrow_left</mat-icon> </button> <button mat-button (click)=\"goRight()\" class=\"mat-icon-button\" aria-label=\"Mover para direita\" mdTooltip=\"Mover para direita\"> <mat-icon>keyboard_arrow_right</mat-icon> </button> <button mat-button (click)=\"goUp()\" class=\"mat-icon-button\" aria-label=\"Mover para cima\" mdTooltip=\"Mover para cima\"> <mat-icon>keyboard_arrow_up</mat-icon> </button> <button mat-button (click)=\"goDown()\" class=\"mat-icon-button\" aria-label=\"Mover para baixo\" mdTooltip=\"Mover para baixo\"> <mat-icon>keyboard_arrow_down</mat-icon> </button> <button mat-button (click)=\"reset()\" class=\"mat-icon-button mat-primary\" aria-label=\"Restaurar imagem original\" mdTooltip=\"Restaurar imagem original\"> <mat-icon>cached</mat-icon> </button> </div></div>","styles":[".crop-image-container{max-height:500px;width:100%}.crop-image-container img{max-width:100%;max-height:100%}.crop-controls{padding-top:20px;padding-bottom:20px}[main-loading]{min-height:120px;padding-top:34px;box-sizing:border-box;flex-direction:column;max-width:100%;place-content:center;align-items:center;display:flex}.upcrop-crop .has-text-centered{text-align:center!important}"]}]}],"members":{"angularCropper":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["angularCropper"]}]}],"config":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"uploader":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onCropImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"setCropping":[{"__symbolic":"method"}],"unsetCropping":[{"__symbolic":"method"}],"goToNextCrop":[{"__symbolic":"method"}],"emitOnCropImage":[{"__symbolic":"method"}],"zoomIn":[{"__symbolic":"method"}],"zoomOut":[{"__symbolic":"method"}],"goLeft":[{"__symbolic":"method"}],"goRight":[{"__symbolic":"method"}],"goUp":[{"__symbolic":"method"}],"goDown":[{"__symbolic":"method"}],"rotateLeft":[{"__symbolic":"method"}],"rotateRight":[{"__symbolic":"method"}],"reset":[{"__symbolic":"method"}]}},"UpcropDialogComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"app-upcrop-dialog","template":"<h2 mat-dialog-title class=\"has-text-danger\"> Upload de imagens <small>com corte</small></h2><mat-dialog-content> <div steps> <div steps-content fxLayout=\"row\" fxLayoutAlign=\"start center\"> <button mat-icon-button fxHide.xs [disabled]=\"!steps.current.previus || (steps.current.previusDisabled && steps.current.previusDisabled())\" (click)=\"steps.current.previusAction()\"> <mat-icon>keyboard_arrow_left</mat-icon> </button> <span fxFlex></span> <h3>Passo <b>{{steps.current.number}}</b> de <b>{{steps.total}}</b> / <span class=\"has-text-primary\">{{steps.current.label}}</span> </h3> <span fxFlex></span> <button mat-icon-button fxHide.xs [disabled]=\"!steps.current.next || (steps.current.nextDisabled && steps.current.nextDisabled())\" (click)=\"steps.current.nextAction()\"> <mat-icon>keyboard_arrow_right</mat-icon> </button> </div></div><div class=\"step-1\" [hidden]=\"steps.current.number !=1\"> <app-upcrop-upload #upcropUpload [config]=\"data.uploadConfig\" (onUploadImage)=\"onUploadImage($event)\"></app-upcrop-upload> </div><div class=\"step-2\" [hidden]=\"steps.current.number !=2\"> <app-upcrop-crop #upcropCrop [config]=\"data.cropConfig\" (onCropImage)=\"onCropImage($event)\"></app-upcrop-crop> </div></mat-dialog-content><mat-dialog-actions *ngIf=\"steps.current.number==1\"> <button mat-button mat-dialog-close>Fechar</button> <button mat-button color=\"primary\" [disabled]=\"!upcropUpload.uploader.queue.length\" (click)=\"goToStep2()\">Continuar</button></mat-dialog-actions><mat-dialog-actions *ngIf=\"steps.current.number==2\"> <button mat-button (click)=\"goToStep1()\">Voltar</button> <button mat-button color=\"primary\" [fxHide]=\"upcropCrop.uploader?.queue?.length==(upcropCrop.currentNumber + 1)\" (click)=\"upcropCrop.goToNextCrop()\">Próxima imagem</button> <button mat-button color=\"primary\" [fxHide]=\"upcropCrop.uploader?.queue?.length > (upcropCrop.currentNumber + 1)\" [disabled]=\"upcropCrop.uploading\" (click)=\"finish()\">Concluir</button></mat-dialog-actions>","styles":["[mat-dialog-title] small{color:#b5b5b5!important;font:400 16px/28px Roboto,\"Helvetica Neue\",sans-serif!important;margin:0 0 16px!important}[steps]{margin:0 -24px 16px;padding-top:16px;padding-bottom:16px;background-color:rgba(0,0,0,.04)}[steps] .has-text-primary{color:#3f51b5!important}[mat-dialog-title] .has-text-danger{color:#f44336!important}"]}]}],"members":{"upcropUpload":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["upcropUpload"]}]}],"upcropCrop":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild"},"arguments":["upcropCrop"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject"},"arguments":[{"__symbolic":"reference","module":"@angular/material","name":"MAT_DIALOG_DATA"}]}]],"parameters":[{"__symbolic":"reference","name":"MatDialogRef","module":"@angular/material","arguments":[{"__symbolic":"reference","name":"UpcropDialogComponent"}]},{"__symbolic":"reference","name":"any"}]}],"ngOnInit":[{"__symbolic":"method"}],"goToStep1":[{"__symbolic":"method"}],"goToStep2":[{"__symbolic":"method"}],"finish":[{"__symbolic":"method"}],"step1NextDisabled":[{"__symbolic":"method"}],"onCropImage":[{"__symbolic":"method"}],"onUploadImage":[{"__symbolic":"method"}],"createUrlParams":[{"__symbolic":"method"}]}},"UpcropImagePreviewDirective":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"img[upcropImagePreview]"}]}],"members":{"image":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer"}]}],"ngOnChanges":[{"__symbolic":"method"}]}},"UpcropService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable"}}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/material","name":"MatDialog"}]}],"open":[{"__symbolic":"method"}]}}},"origins":{"AngularUpcropModule":"./index","UpcropUploadComponent":"./upcrop-upload/upcrop-upload.component","UpcropCropComponent":"./upcrop-crop/upcrop-crop.component","UpcropDialogComponent":"./upcrop-dialog/upcrop-dialog.component","UpcropImagePreviewDirective":"./upcrop-image-preview/upcrop-image-preview.directive","UpcropService":"./upcrop/upcrop.service"},"importAs":"angular-upcrop"}

angular-upcrop.umd.js

@@ -90,4 +90,4 @@ (function (global, factory) {
                 selector: 'app-upcrop-upload',
-                template: "<label ng2FileDrop multiple class=\"my-drop-zone\" [ngClass]=\"{'nv-file-over': hasFileOver}\" (fileOver)=\"onFileOver($event)\" [uploader]=\"uploader\" fxLayout fxLayoutAlign=\"center center\"> \u00C1rea de upload <input type=\"file\" ng2FileSelect multiple [uploader]=\"uploader\" style=\"display: none\"/></label><table class=\"table upcrop-upload-table\"> <thead> <tr> <th>Preview</th> <th>Arquivo</th> <th> <md-icon class=\"is-pulled-right\">settings</md-icon> </th> </tr></thead> <tbody> <tr *ngFor=\"let item of uploader.queue\"> <td style=\"width:120px\"> <img upcropImagePreview [image]=\"item?._file\" class=\"media-object\"/> </td><td>{{truncate(item?.file?.name, 16)}}</td><td class=\"actions\" style=\"width:53px\"> <a class=\"button is-small is-danger is-outlined\" (click)=\"item.remove()\"> <span class=\"icon is-small\"> <i class=\"fa fa-trash\"></i> </span> </a> </td></tr><tr [hidden]=\"uploader.queue.length\"> <td colspan=\"3\" class=\"has-text-danger\"> Nenhum arquivo, adicione acima. </td></tr></tbody></table>",
-                styles: ['.my-drop-zone{border:2px dashed rgba(0,0,0,.04);width:100%;display:flex;padding:20px;background-color:rgba(0,0,0,.04);color:rgba(0,0,0,.7)}.nv-file-over{border:2px dashed rgba(244,67,54,.4)}[upcropImagePreview]{display:block}.upcrop-upload-table{background-color:#fff;color:#363636}.upcrop-upload-table td,.upcrop-upload-table th{border:1px solid #dbdbdb;border-width:0 0 1px;padding:.5em .75em;vertical-align:top}.upcrop-upload-table td.is-white,.upcrop-upload-table th.is-white{background-color:#fff;border-color:#fff;color:#0a0a0a}.upcrop-upload-table td.is-black,.upcrop-upload-table th.is-black{background-color:#0a0a0a;border-color:#0a0a0a;color:#fff}.upcrop-upload-table td.is-light,.upcrop-upload-table th.is-light{background-color:#f5f5f5;border-color:#f5f5f5;color:#363636}.upcrop-upload-table td.is-dark,.upcrop-upload-table th.is-dark{background-color:#363636;border-color:#363636;color:#f5f5f5}.upcrop-upload-table td.is-primary,.upcrop-upload-table th.is-primary{background-color:#00d1b2;border-color:#00d1b2;color:#fff}.upcrop-upload-table td.is-info,.upcrop-upload-table th.is-info{background-color:#3273dc;border-color:#3273dc;color:#fff}.upcrop-upload-table td.is-success,.upcrop-upload-table th.is-success{background-color:#23d160;border-color:#23d160;color:#fff}.upcrop-upload-table td.is-warning,.upcrop-upload-table th.is-warning{background-color:#ffdd57;border-color:#ffdd57;color:rgba(0,0,0,.7)}.upcrop-upload-table td.is-danger,.upcrop-upload-table th.is-danger{background-color:#ff3860;border-color:#ff3860;color:#fff}.upcrop-upload-table td.is-narrow,.upcrop-upload-table th.is-narrow{white-space:nowrap;width:1%}.upcrop-upload-table th{color:#363636;text-align:left}.upcrop-upload-table tr:hover{background-color:#fafafa}.upcrop-upload-table tr.is-selected{background-color:#00d1b2;color:#fff}.upcrop-upload-table tr.is-selected a,.upcrop-upload-table tr.is-selected strong{color:currentColor}.upcrop-upload-table tr.is-selected td,.upcrop-upload-table tr.is-selected th{border-color:#fff;color:currentColor}.upcrop-upload-table thead td,.upcrop-upload-table thead th{color:#363636}.upcrop-upload-table tfoot td,.upcrop-upload-table tfoot th{border-width:2px 0 0;color:#363636}.upcrop-upload-table tbody tr:last-child td,.upcrop-upload-table tbody tr:last-child th{border-bottom-width:0}.upcrop-upload-table.is-bordered td,.upcrop-upload-table.is-bordered th{border-width:1px}.upcrop-upload-table.is-bordered tr:last-child td,.upcrop-upload-table.is-bordered tr:last-child th{border-bottom-width:1px}.upcrop-upload-table.is-fullwidth{width:100%}.upcrop-upload-table.is-narrow td,.upcrop-upload-table.is-narrow th{padding:.25em .5em}.upcrop-upload-table.is-striped tbody tr:not(.is-selected):nth-child(even){background-color:#fafafa}.upcrop-upload-table.is-striped tbody tr:not(.is-selected):nth-child(even):hover{background-color:#f5f5f5}td,th{padding:0;text-align:left}.upcrop-upload-table-search{display:flex;padding:1.3em 1.6em}.upcrop-upload-table-search input{font-size:14px;flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1;border:none;background-color:transparent;outline:-webkit-focus-ring-color auto 0!important}.upcrop-upload-table-search>md-icon{margin-right:16px;margin-top:2px}[table-loading]{position:absolute;width:100%;margin-top:59px!important;background-color:rgba(255,255,255,.9);height:calc(100% - 59px);z-index:1}[table-no-entries]{padding:1.6em}.mat-card[has-table]{padding:0}.mat-card[has-table] .mat-card-actions{padding:8px!important;margin:0;border-top:1px solid #dbdbdb;border-color:rgba(0,0,0,.09)}.mat-card[has-table] .mat-card-actions .mat-icon-button{color:rgba(0,0,0,.54)}.mat-card[has-table] .mat-card-actions .mat-icon-button[disabled]{color:rgba(0,0,0,.18)}.mat-card[has-table] .mat-card-actions .mat-paginator-page-size-label{margin:0 15px;color:rgba(0,0,0,.54);font-size:12px;font-weight:400}.upcrop-upload-table{border-collapse:collapse;border-spacing:0;width:100%;margin-bottom:0}.upcrop-upload-table .actions .button{margin-bottom:-.25em;margin-top:-.15em}.upcrop-upload-table thead tr{background-color:rgba(0,0,0,.04)!important}.upcrop-upload-table thead td:first-of-type,.upcrop-upload-table thead th:first-of-type{padding-left:1.8em}.upcrop-upload-table thead td:last-of-type,.upcrop-upload-table thead th:last-of-type{padding-right:1.8em}.upcrop-upload-table thead td md-icon,.upcrop-upload-table thead th md-icon{height:16px;width:16px;line-height:16px;font-size:16px;vertical-align:bottom;margin-right:3px}.upcrop-upload-table tbody td,.upcrop-upload-table tbody th{border-color:rgba(0,0,0,.04)}.upcrop-upload-table tbody td:first-of-type,.upcrop-upload-table tbody th:first-of-type{padding-left:1.6em}.upcrop-upload-table tbody td:last-of-type,.upcrop-upload-table tbody th:last-of-type{padding-right:1.6em}.upcrop-upload-table thead td,.upcrop-upload-table thead th{color:rgba(0,0,0,.54);font-size:12px;font-weight:400;padding:1.3em .75em;border:none;border-width:0}.upcrop-upload-table tbody td{color:rgba(0,0,0,.87);padding:1em .75em;font-size:.9rem;font-weight:400}@media (max-width:800px){.upcrop-upload-table{vertical-align:top;max-width:100%;overflow-x:auto;white-space:nowrap;border-collapse:collapse;border-spacing:0;display:flex;overflow:hidden;background:0 0}.upcrop-upload-table .actions a{margin-top:-.35em}.upcrop-upload-table .is-pulled-right{float:none!important}.upcrop-upload-table thead{display:flex;flex-shrink:0;min-width:min-content}.upcrop-upload-table thead td,.upcrop-upload-table thead th{padding:1.3em 1.8em;text-align:right;width:100%!important}.upcrop-upload-table thead td md-icon,.upcrop-upload-table thead th md-icon{margin-right:0}.upcrop-upload-table tbody{flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1;-webkit-overflow-scrolling:touch;background:radial-gradient(left,ellipse,rgba(0,0,0,.2) 0,transparent 75%) 0 center,radial-gradient(right,ellipse,rgba(0,0,0,.2) 0,transparent 75%) 100% center;background-size:10px 100%,10px 100%;background-attachment:scroll,scroll;background-repeat:no-repeat;display:flex;position:relative;overflow-x:auto;overflow-y:hidden;margin-right:1.6em}.upcrop-upload-table tbody tr{flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1}.upcrop-upload-table tbody td,.upcrop-upload-table tbody th{padding:1.155em 1.6em;text-align:left!important}.upcrop-upload-table tbody td:first-of-type,.upcrop-upload-table tbody th:first-of-type{padding-left:1.6em}.upcrop-upload-table tbody td:last-of-type,.upcrop-upload-table tbody th:last-of-type{padding-right:1.6em}.upcrop-upload-table tr{display:flex;flex-direction:column;min-width:min-content;flex-shrink:0}.upcrop-upload-table td,.upcrop-upload-table th{display:block;background-image:none!important;border-left:0}.upcrop-upload-table td:first-child,.upcrop-upload-table th:first-child{background-image:linear-gradient(to right,#fff 50%,rgba(255,255,255,0) 100%);background-repeat:no-repeat;background-size:20px 100%}.upcrop-upload-table td:last-child,.upcrop-upload-table th:last-child{background-image:linear-gradient(to left,#fff 50%,rgba(255,255,255,0) 100%);background-repeat:no-repeat;background-position:100% 0;background-size:20px 100%}.upcrop-upload-table td:not(:last-child),.upcrop-upload-table th:not(:last-child){border-bottom:0}}.upcrop-upload-table ::-webkit-scrollbar{height:8px;overflow:visible;width:16px}.upcrop-upload-table ::-webkit-scrollbar-button{height:0;width:0}.upcrop-upload-table ::-webkit-scrollbar-corner{background:0 0}.upcrop-upload-table ::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.2);background-clip:padding-box;border:solid transparent;border-width:1px 1px 1px 6px;min-height:28px;padding:100px 0 0;-webkit-box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07);box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07)}.upcrop-upload-table ::-webkit-scrollbar-track{background-clip:padding-box;border:solid transparent;border-width:0 0 0 4px}[enterlist] [has-table]{margin-right:-24px;margin-left:-24px}[enterlist] [has-table] .upcrop-upload-table{background-color:transparent}[enterlist] [has-table] .upcrop-upload-table thead tr{background-color:rgba(0,0,0,.02)!important}[enterlist] [has-table] .upcrop-upload-table tr:hover{background-color:inherit}']
+                template: "<label ng2FileDrop multiple class=\"my-drop-zone\" [ngClass]=\"{'nv-file-over': hasFileOver}\" (fileOver)=\"onFileOver($event)\" [uploader]=\"uploader\" fxLayout fxLayoutAlign=\"center center\"> \u00C1rea de upload <input type=\"file\" ng2FileSelect multiple [uploader]=\"uploader\" style=\"display: none\"/></label><table class=\"table upcrop-upload-table\"> <thead> <tr> <th>Preview</th> <th>Arquivo</th> <th> <mat-icon class=\"is-pulled-right\">settings</mat-icon> </th> </tr></thead> <tbody> <tr *ngFor=\"let item of uploader.queue\"> <td style=\"width:120px\"> <img upcropImagePreview [image]=\"item?._file\" class=\"media-object\"/> </td><td>{{truncate(item?.file?.name, 16)}}</td><td class=\"actions\" style=\"width:53px\"> <a class=\"button is-small is-danger is-outlined\" (click)=\"item.remove()\"> <span class=\"icon is-small\"> <i class=\"fa fa-trash\"></i> </span> </a> </td></tr><tr [hidden]=\"uploader.queue.length\"> <td colspan=\"3\" class=\"has-text-danger\"> Nenhum arquivo, adicione acima. </td></tr></tbody></table>",
+                styles: ['.my-drop-zone{border:2px dashed rgba(0,0,0,.04);width:100%;display:flex;padding:20px;background-color:rgba(0,0,0,.04);color:rgba(0,0,0,.7)}.nv-file-over{border:2px dashed rgba(244,67,54,.4)}[upcropImagePreview]{display:block}.upcrop-upload-table{background-color:#fff;color:#363636}.upcrop-upload-table td,.upcrop-upload-table th{border:1px solid #dbdbdb;border-width:0 0 1px;padding:.5em .75em;vertical-align:top}.upcrop-upload-table td.is-white,.upcrop-upload-table th.is-white{background-color:#fff;border-color:#fff;color:#0a0a0a}.upcrop-upload-table td.is-black,.upcrop-upload-table th.is-black{background-color:#0a0a0a;border-color:#0a0a0a;color:#fff}.upcrop-upload-table td.is-light,.upcrop-upload-table th.is-light{background-color:#f5f5f5;border-color:#f5f5f5;color:#363636}.upcrop-upload-table td.is-dark,.upcrop-upload-table th.is-dark{background-color:#363636;border-color:#363636;color:#f5f5f5}.upcrop-upload-table td.is-primary,.upcrop-upload-table th.is-primary{background-color:#00d1b2;border-color:#00d1b2;color:#fff}.upcrop-upload-table td.is-info,.upcrop-upload-table th.is-info{background-color:#3273dc;border-color:#3273dc;color:#fff}.upcrop-upload-table td.is-success,.upcrop-upload-table th.is-success{background-color:#23d160;border-color:#23d160;color:#fff}.upcrop-upload-table td.is-warning,.upcrop-upload-table th.is-warning{background-color:#ffdd57;border-color:#ffdd57;color:rgba(0,0,0,.7)}.upcrop-upload-table td.is-danger,.upcrop-upload-table th.is-danger{background-color:#ff3860;border-color:#ff3860;color:#fff}.upcrop-upload-table td.is-narrow,.upcrop-upload-table th.is-narrow{white-space:nowrap;width:1%}.upcrop-upload-table th{color:#363636;text-align:left}.upcrop-upload-table tr:hover{background-color:#fafafa}.upcrop-upload-table tr.is-selected{background-color:#00d1b2;color:#fff}.upcrop-upload-table tr.is-selected a,.upcrop-upload-table tr.is-selected strong{color:currentColor}.upcrop-upload-table tr.is-selected td,.upcrop-upload-table tr.is-selected th{border-color:#fff;color:currentColor}.upcrop-upload-table thead td,.upcrop-upload-table thead th{color:#363636}.upcrop-upload-table tfoot td,.upcrop-upload-table tfoot th{border-width:2px 0 0;color:#363636}.upcrop-upload-table tbody tr:last-child td,.upcrop-upload-table tbody tr:last-child th{border-bottom-width:0}.upcrop-upload-table.is-bordered td,.upcrop-upload-table.is-bordered th{border-width:1px}.upcrop-upload-table.is-bordered tr:last-child td,.upcrop-upload-table.is-bordered tr:last-child th{border-bottom-width:1px}.upcrop-upload-table.is-fullwidth{width:100%}.upcrop-upload-table.is-narrow td,.upcrop-upload-table.is-narrow th{padding:.25em .5em}.upcrop-upload-table.is-striped tbody tr:not(.is-selected):nth-child(even){background-color:#fafafa}.upcrop-upload-table.is-striped tbody tr:not(.is-selected):nth-child(even):hover{background-color:#f5f5f5}td,th{padding:0;text-align:left}.upcrop-upload-table-search{display:flex;padding:1.3em 1.6em}.upcrop-upload-table-search input{font-size:14px;flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1;border:none;background-color:transparent;outline:-webkit-focus-ring-color auto 0!important}.upcrop-upload-table-search>mat-icon{margin-right:16px;margin-top:2px}[table-loading]{position:absolute;width:100%;margin-top:59px!important;background-color:rgba(255,255,255,.9);height:calc(100% - 59px);z-index:1}[table-no-entries]{padding:1.6em}.mat-card[has-table]{padding:0}.mat-card[has-table] .mat-card-actions{padding:8px!important;margin:0;border-top:1px solid #dbdbdb;border-color:rgba(0,0,0,.09)}.mat-card[has-table] .mat-card-actions .mat-icon-button{color:rgba(0,0,0,.54)}.mat-card[has-table] .mat-card-actions .mat-icon-button[disabled]{color:rgba(0,0,0,.18)}.mat-card[has-table] .mat-card-actions .mat-paginator-page-size-label{margin:0 15px;color:rgba(0,0,0,.54);font-size:12px;font-weight:400}.upcrop-upload-table{border-collapse:collapse;border-spacing:0;width:100%;margin-bottom:0}.upcrop-upload-table .actions .button{margin-bottom:-.25em;margin-top:-.15em}.upcrop-upload-table thead tr{background-color:rgba(0,0,0,.04)!important}.upcrop-upload-table thead td:first-of-type,.upcrop-upload-table thead th:first-of-type{padding-left:1.8em}.upcrop-upload-table thead td:last-of-type,.upcrop-upload-table thead th:last-of-type{padding-right:1.8em}.upcrop-upload-table thead td mat-icon,.upcrop-upload-table thead th mat-icon{height:16px;width:16px;line-height:16px;font-size:16px;vertical-align:bottom;margin-right:3px}.upcrop-upload-table tbody td,.upcrop-upload-table tbody th{border-color:rgba(0,0,0,.04)}.upcrop-upload-table tbody td:first-of-type,.upcrop-upload-table tbody th:first-of-type{padding-left:1.6em}.upcrop-upload-table tbody td:last-of-type,.upcrop-upload-table tbody th:last-of-type{padding-right:1.6em}.upcrop-upload-table thead td,.upcrop-upload-table thead th{color:rgba(0,0,0,.54);font-size:12px;font-weight:400;padding:1.3em .75em;border:none;border-width:0}.upcrop-upload-table tbody td{color:rgba(0,0,0,.87);padding:1em .75em;font-size:.9rem;font-weight:400}@media (max-width:800px){.upcrop-upload-table{vertical-align:top;max-width:100%;overflow-x:auto;white-space:nowrap;border-collapse:collapse;border-spacing:0;display:flex;overflow:hidden;background:0 0}.upcrop-upload-table .actions a{margin-top:-.35em}.upcrop-upload-table .is-pulled-right{float:none!important}.upcrop-upload-table thead{display:flex;flex-shrink:0;min-width:min-content}.upcrop-upload-table thead td,.upcrop-upload-table thead th{padding:1.3em 1.8em;text-align:right;width:100%!important}.upcrop-upload-table thead td mat-icon,.upcrop-upload-table thead th mat-icon{margin-right:0}.upcrop-upload-table tbody{flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1;-webkit-overflow-scrolling:touch;background:radial-gradient(left,ellipse,rgba(0,0,0,.2) 0,transparent 75%) 0 center,radial-gradient(right,ellipse,rgba(0,0,0,.2) 0,transparent 75%) 100% center;background-size:10px 100%,10px 100%;background-attachment:scroll,scroll;background-repeat:no-repeat;display:flex;position:relative;overflow-x:auto;overflow-y:hidden;margin-right:1.6em}.upcrop-upload-table tbody tr{flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1}.upcrop-upload-table tbody td,.upcrop-upload-table tbody th{padding:1.155em 1.6em;text-align:left!important}.upcrop-upload-table tbody td:first-of-type,.upcrop-upload-table tbody th:first-of-type{padding-left:1.6em}.upcrop-upload-table tbody td:last-of-type,.upcrop-upload-table tbody th:last-of-type{padding-right:1.6em}.upcrop-upload-table tr{display:flex;flex-direction:column;min-width:min-content;flex-shrink:0}.upcrop-upload-table td,.upcrop-upload-table th{display:block;background-image:none!important;border-left:0}.upcrop-upload-table td:first-child,.upcrop-upload-table th:first-child{background-image:linear-gradient(to right,#fff 50%,rgba(255,255,255,0) 100%);background-repeat:no-repeat;background-size:20px 100%}.upcrop-upload-table td:last-child,.upcrop-upload-table th:last-child{background-image:linear-gradient(to left,#fff 50%,rgba(255,255,255,0) 100%);background-repeat:no-repeat;background-position:100% 0;background-size:20px 100%}.upcrop-upload-table td:not(:last-child),.upcrop-upload-table th:not(:last-child){border-bottom:0}}.upcrop-upload-table ::-webkit-scrollbar{height:8px;overflow:visible;width:16px}.upcrop-upload-table ::-webkit-scrollbar-button{height:0;width:0}.upcrop-upload-table ::-webkit-scrollbar-corner{background:0 0}.upcrop-upload-table ::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.2);background-clip:padding-box;border:solid transparent;border-width:1px 1px 1px 6px;min-height:28px;padding:100px 0 0;-webkit-box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07);box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07)}.upcrop-upload-table ::-webkit-scrollbar-track{background-clip:padding-box;border:solid transparent;border-width:0 0 0 4px}[enterlist] [has-table]{margin-right:-24px;margin-left:-24px}[enterlist] [has-table] .upcrop-upload-table{background-color:transparent}[enterlist] [has-table] .upcrop-upload-table thead tr{background-color:rgba(0,0,0,.02)!important}[enterlist] [has-table] .upcrop-upload-table tr:hover{background-color:inherit}']
             },] },
@@ -314,3 +314,3 @@ ];
                 selector: 'app-upcrop-crop',
-                template: "<div main-loading [fxHide]=\"!uploading\"> <div class=\"spinner\"></div></div><div [hidden]=\"uploading\" class=\"upcrop-crop\"> <h2 class=\"has-text-centered mat-subheading-2\">Imagem{{currentNumber + 1}}de{{uploader?.queue?.length}}</h2> <div class=\"crop-image-container\"> <angular-cropper #angularCropper *ngIf=\"current && current._dataUrl\" [cropperOptions]=\"config\" [imageUrl]=\"current?._dataUrl\"></angular-cropper> </div><div class=\"crop-controls\" fxLayout fxLayoutAlign=\"center center\" fxLayoutWrap *ngIf=\"current && current._dataUrl\"> <button md-button (click)=\"zoomIn()\" class=\"md-icon-button\" aria-label=\"Aumentar zoom\" mdTooltip=\"Aumentar zoom\"> <md-icon>zoom_in</md-icon> </button> <button md-button (click)=\"zoomOut()\" class=\"md-icon-button\" aria-label=\"Diminuir zoom\" mdTooltip=\"Diminuir zoom\"> <md-icon>zoom_out</md-icon> </button> <button md-button (click)=\"goLeft()\" class=\"md-icon-button\" aria-label=\"Mover para esquerda\" mdTooltip=\"Mover para esquerda\"> <md-icon>keyboard_arrow_left</md-icon> </button> <button md-button (click)=\"goRight()\" class=\"md-icon-button\" aria-label=\"Mover para direita\" mdTooltip=\"Mover para direita\"> <md-icon>keyboard_arrow_right</md-icon> </button> <button md-button (click)=\"goUp()\" class=\"md-icon-button\" aria-label=\"Mover para cima\" mdTooltip=\"Mover para cima\"> <md-icon>keyboard_arrow_up</md-icon> </button> <button md-button (click)=\"goDown()\" class=\"md-icon-button\" aria-label=\"Mover para baixo\" mdTooltip=\"Mover para baixo\"> <md-icon>keyboard_arrow_down</md-icon> </button> <button md-button (click)=\"reset()\" class=\"md-icon-button md-primary\" aria-label=\"Restaurar imagem original\" mdTooltip=\"Restaurar imagem original\"> <md-icon>cached</md-icon> </button> </div></div>",
+                template: "<div main-loading [fxHide]=\"!uploading\"> <div class=\"spinner\"></div></div><div [hidden]=\"uploading\" class=\"upcrop-crop\"> <h2 class=\"has-text-centered mat-subheading-2\">Imagem{{currentNumber + 1}}de{{uploader?.queue?.length}}</h2> <div class=\"crop-image-container\"> <angular-cropper #angularCropper *ngIf=\"current && current._dataUrl\" [cropperOptions]=\"config\" [imageUrl]=\"current?._dataUrl\"></angular-cropper> </div><div class=\"crop-controls\" fxLayout fxLayoutAlign=\"center center\" fxLayoutWrap *ngIf=\"current && current._dataUrl\"> <button mat-button (click)=\"zoomIn()\" class=\"mat-icon-button\" aria-label=\"Aumentar zoom\" mdTooltip=\"Aumentar zoom\"> <mat-icon>zoom_in</mat-icon> </button> <button mat-button (click)=\"zoomOut()\" class=\"mat-icon-button\" aria-label=\"Diminuir zoom\" mdTooltip=\"Diminuir zoom\"> <mat-icon>zoom_out</mat-icon> </button> <button mat-button (click)=\"goLeft()\" class=\"mat-icon-button\" aria-label=\"Mover para esquerda\" mdTooltip=\"Mover para esquerda\"> <mat-icon>keyboard_arrow_left</mat-icon> </button> <button mat-button (click)=\"goRight()\" class=\"mat-icon-button\" aria-label=\"Mover para direita\" mdTooltip=\"Mover para direita\"> <mat-icon>keyboard_arrow_right</mat-icon> </button> <button mat-button (click)=\"goUp()\" class=\"mat-icon-button\" aria-label=\"Mover para cima\" mdTooltip=\"Mover para cima\"> <mat-icon>keyboard_arrow_up</mat-icon> </button> <button mat-button (click)=\"goDown()\" class=\"mat-icon-button\" aria-label=\"Mover para baixo\" mdTooltip=\"Mover para baixo\"> <mat-icon>keyboard_arrow_down</mat-icon> </button> <button mat-button (click)=\"reset()\" class=\"mat-icon-button mat-primary\" aria-label=\"Restaurar imagem original\" mdTooltip=\"Restaurar imagem original\"> <mat-icon>cached</mat-icon> </button> </div></div>",
                 styles: ['.crop-image-container{max-height:500px;width:100%}.crop-image-container img{max-width:100%;max-height:100%}.crop-controls{padding-top:20px;padding-bottom:20px}[main-loading]{min-height:120px;padding-top:34px;box-sizing:border-box;flex-direction:column;max-width:100%;place-content:center;align-items:center;display:flex}.upcrop-crop .has-text-centered{text-align:center!important}']
@@ -475,4 +475,4 @@ },] },
                 selector: 'app-upcrop-dialog',
-                template: "<h2 md-dialog-title class=\"has-text-danger\"> Upload de imagens <small>com corte</small></h2><md-dialog-content> <div steps> <div steps-content fxLayout=\"row\" fxLayoutAlign=\"start center\"> <button md-icon-button fxHide.xs [disabled]=\"!steps.current.previus || (steps.current.previusDisabled && steps.current.previusDisabled())\" (click)=\"steps.current.previusAction()\"> <md-icon>keyboard_arrow_left</md-icon> </button> <span fxFlex></span> <h3>Passo <b>{{steps.current.number}}</b> de <b>{{steps.total}}</b> / <span class=\"has-text-primary\">{{steps.current.label}}</span> </h3> <span fxFlex></span> <button md-icon-button fxHide.xs [disabled]=\"!steps.current.next || (steps.current.nextDisabled && steps.current.nextDisabled())\" (click)=\"steps.current.nextAction()\"> <md-icon>keyboard_arrow_right</md-icon> </button> </div></div><div class=\"step-1\" [hidden]=\"steps.current.number !=1\"> <app-upcrop-upload #upcropUpload [config]=\"data.uploadConfig\" (onUploadImage)=\"onUploadImage($event)\"></app-upcrop-upload> </div><div class=\"step-2\" [hidden]=\"steps.current.number !=2\"> <app-upcrop-crop #upcropCrop [config]=\"data.cropConfig\" (onCropImage)=\"onCropImage($event)\"></app-upcrop-crop> </div></md-dialog-content><md-dialog-actions *ngIf=\"steps.current.number==1\"> <button md-button md-dialog-close>Fechar</button> <button md-button color=\"primary\" [disabled]=\"!upcropUpload.uploader.queue.length\" (click)=\"goToStep2()\">Continuar</button></md-dialog-actions><md-dialog-actions *ngIf=\"steps.current.number==2\"> <button md-button (click)=\"goToStep1()\">Voltar</button> <button md-button color=\"primary\" [fxHide]=\"upcropCrop.uploader?.queue?.length==(upcropCrop.currentNumber + 1)\" (click)=\"upcropCrop.goToNextCrop()\">Pr\u00F3xima imagem</button> <button md-button color=\"primary\" [fxHide]=\"upcropCrop.uploader?.queue?.length > (upcropCrop.currentNumber + 1)\" [disabled]=\"upcropCrop.uploading\" (click)=\"finish()\">Concluir</button></md-dialog-actions>",
-                styles: ['[md-dialog-title] small{color:#b5b5b5!important;font:400 16px/28px Roboto,"Helvetica Neue",sans-serif!important;margin:0 0 16px!important}[steps]{margin:0 -24px 16px;padding-top:16px;padding-bottom:16px;background-color:rgba(0,0,0,.04)}[steps] .has-text-primary{color:#3f51b5!important}[md-dialog-title] .has-text-danger{color:#f44336!important}']
+                template: "<h2 mat-dialog-title class=\"has-text-danger\"> Upload de imagens <small>com corte</small></h2><mat-dialog-content> <div steps> <div steps-content fxLayout=\"row\" fxLayoutAlign=\"start center\"> <button mat-icon-button fxHide.xs [disabled]=\"!steps.current.previus || (steps.current.previusDisabled && steps.current.previusDisabled())\" (click)=\"steps.current.previusAction()\"> <mat-icon>keyboard_arrow_left</mat-icon> </button> <span fxFlex></span> <h3>Passo <b>{{steps.current.number}}</b> de <b>{{steps.total}}</b> / <span class=\"has-text-primary\">{{steps.current.label}}</span> </h3> <span fxFlex></span> <button mat-icon-button fxHide.xs [disabled]=\"!steps.current.next || (steps.current.nextDisabled && steps.current.nextDisabled())\" (click)=\"steps.current.nextAction()\"> <mat-icon>keyboard_arrow_right</mat-icon> </button> </div></div><div class=\"step-1\" [hidden]=\"steps.current.number !=1\"> <app-upcrop-upload #upcropUpload [config]=\"data.uploadConfig\" (onUploadImage)=\"onUploadImage($event)\"></app-upcrop-upload> </div><div class=\"step-2\" [hidden]=\"steps.current.number !=2\"> <app-upcrop-crop #upcropCrop [config]=\"data.cropConfig\" (onCropImage)=\"onCropImage($event)\"></app-upcrop-crop> </div></mat-dialog-content><mat-dialog-actions *ngIf=\"steps.current.number==1\"> <button mat-button mat-dialog-close>Fechar</button> <button mat-button color=\"primary\" [disabled]=\"!upcropUpload.uploader.queue.length\" (click)=\"goToStep2()\">Continuar</button></mat-dialog-actions><mat-dialog-actions *ngIf=\"steps.current.number==2\"> <button mat-button (click)=\"goToStep1()\">Voltar</button> <button mat-button color=\"primary\" [fxHide]=\"upcropCrop.uploader?.queue?.length==(upcropCrop.currentNumber + 1)\" (click)=\"upcropCrop.goToNextCrop()\">Pr\u00F3xima imagem</button> <button mat-button color=\"primary\" [fxHide]=\"upcropCrop.uploader?.queue?.length > (upcropCrop.currentNumber + 1)\" [disabled]=\"upcropCrop.uploading\" (click)=\"finish()\">Concluir</button></mat-dialog-actions>",
+                styles: ['[mat-dialog-title] small{color:#b5b5b5!important;font:400 16px/28px Roboto,"Helvetica Neue",sans-serif!important;margin:0 0 16px!important}[steps]{margin:0 -24px 16px;padding-top:16px;padding-bottom:16px;background-color:rgba(0,0,0,.04)}[steps] .has-text-primary{color:#3f51b5!important}[mat-dialog-title] .has-text-danger{color:#f44336!important}']
             },] },
@@ -479,0 +479,0 @@ ];

index.js

@@ -91,4 +91,4 @@ import { Component, Directive, ElementRef, EventEmitter, Inject, Injectable, Input, NgModule, Output, Renderer, ViewChild } from '@angular/core';
                 selector: 'app-upcrop-upload',
-                template: "<label ng2FileDrop multiple class=\"my-drop-zone\" [ngClass]=\"{'nv-file-over': hasFileOver}\" (fileOver)=\"onFileOver($event)\" [uploader]=\"uploader\" fxLayout fxLayoutAlign=\"center center\"> \u00C1rea de upload <input type=\"file\" ng2FileSelect multiple [uploader]=\"uploader\" style=\"display: none\"/></label><table class=\"table upcrop-upload-table\"> <thead> <tr> <th>Preview</th> <th>Arquivo</th> <th> <md-icon class=\"is-pulled-right\">settings</md-icon> </th> </tr></thead> <tbody> <tr *ngFor=\"let item of uploader.queue\"> <td style=\"width:120px\"> <img upcropImagePreview [image]=\"item?._file\" class=\"media-object\"/> </td><td>{{truncate(item?.file?.name, 16)}}</td><td class=\"actions\" style=\"width:53px\"> <a class=\"button is-small is-danger is-outlined\" (click)=\"item.remove()\"> <span class=\"icon is-small\"> <i class=\"fa fa-trash\"></i> </span> </a> </td></tr><tr [hidden]=\"uploader.queue.length\"> <td colspan=\"3\" class=\"has-text-danger\"> Nenhum arquivo, adicione acima. </td></tr></tbody></table>",
-                styles: ['.my-drop-zone{border:2px dashed rgba(0,0,0,.04);width:100%;display:flex;padding:20px;background-color:rgba(0,0,0,.04);color:rgba(0,0,0,.7)}.nv-file-over{border:2px dashed rgba(244,67,54,.4)}[upcropImagePreview]{display:block}.upcrop-upload-table{background-color:#fff;color:#363636}.upcrop-upload-table td,.upcrop-upload-table th{border:1px solid #dbdbdb;border-width:0 0 1px;padding:.5em .75em;vertical-align:top}.upcrop-upload-table td.is-white,.upcrop-upload-table th.is-white{background-color:#fff;border-color:#fff;color:#0a0a0a}.upcrop-upload-table td.is-black,.upcrop-upload-table th.is-black{background-color:#0a0a0a;border-color:#0a0a0a;color:#fff}.upcrop-upload-table td.is-light,.upcrop-upload-table th.is-light{background-color:#f5f5f5;border-color:#f5f5f5;color:#363636}.upcrop-upload-table td.is-dark,.upcrop-upload-table th.is-dark{background-color:#363636;border-color:#363636;color:#f5f5f5}.upcrop-upload-table td.is-primary,.upcrop-upload-table th.is-primary{background-color:#00d1b2;border-color:#00d1b2;color:#fff}.upcrop-upload-table td.is-info,.upcrop-upload-table th.is-info{background-color:#3273dc;border-color:#3273dc;color:#fff}.upcrop-upload-table td.is-success,.upcrop-upload-table th.is-success{background-color:#23d160;border-color:#23d160;color:#fff}.upcrop-upload-table td.is-warning,.upcrop-upload-table th.is-warning{background-color:#ffdd57;border-color:#ffdd57;color:rgba(0,0,0,.7)}.upcrop-upload-table td.is-danger,.upcrop-upload-table th.is-danger{background-color:#ff3860;border-color:#ff3860;color:#fff}.upcrop-upload-table td.is-narrow,.upcrop-upload-table th.is-narrow{white-space:nowrap;width:1%}.upcrop-upload-table th{color:#363636;text-align:left}.upcrop-upload-table tr:hover{background-color:#fafafa}.upcrop-upload-table tr.is-selected{background-color:#00d1b2;color:#fff}.upcrop-upload-table tr.is-selected a,.upcrop-upload-table tr.is-selected strong{color:currentColor}.upcrop-upload-table tr.is-selected td,.upcrop-upload-table tr.is-selected th{border-color:#fff;color:currentColor}.upcrop-upload-table thead td,.upcrop-upload-table thead th{color:#363636}.upcrop-upload-table tfoot td,.upcrop-upload-table tfoot th{border-width:2px 0 0;color:#363636}.upcrop-upload-table tbody tr:last-child td,.upcrop-upload-table tbody tr:last-child th{border-bottom-width:0}.upcrop-upload-table.is-bordered td,.upcrop-upload-table.is-bordered th{border-width:1px}.upcrop-upload-table.is-bordered tr:last-child td,.upcrop-upload-table.is-bordered tr:last-child th{border-bottom-width:1px}.upcrop-upload-table.is-fullwidth{width:100%}.upcrop-upload-table.is-narrow td,.upcrop-upload-table.is-narrow th{padding:.25em .5em}.upcrop-upload-table.is-striped tbody tr:not(.is-selected):nth-child(even){background-color:#fafafa}.upcrop-upload-table.is-striped tbody tr:not(.is-selected):nth-child(even):hover{background-color:#f5f5f5}td,th{padding:0;text-align:left}.upcrop-upload-table-search{display:flex;padding:1.3em 1.6em}.upcrop-upload-table-search input{font-size:14px;flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1;border:none;background-color:transparent;outline:-webkit-focus-ring-color auto 0!important}.upcrop-upload-table-search>md-icon{margin-right:16px;margin-top:2px}[table-loading]{position:absolute;width:100%;margin-top:59px!important;background-color:rgba(255,255,255,.9);height:calc(100% - 59px);z-index:1}[table-no-entries]{padding:1.6em}.mat-card[has-table]{padding:0}.mat-card[has-table] .mat-card-actions{padding:8px!important;margin:0;border-top:1px solid #dbdbdb;border-color:rgba(0,0,0,.09)}.mat-card[has-table] .mat-card-actions .mat-icon-button{color:rgba(0,0,0,.54)}.mat-card[has-table] .mat-card-actions .mat-icon-button[disabled]{color:rgba(0,0,0,.18)}.mat-card[has-table] .mat-card-actions .mat-paginator-page-size-label{margin:0 15px;color:rgba(0,0,0,.54);font-size:12px;font-weight:400}.upcrop-upload-table{border-collapse:collapse;border-spacing:0;width:100%;margin-bottom:0}.upcrop-upload-table .actions .button{margin-bottom:-.25em;margin-top:-.15em}.upcrop-upload-table thead tr{background-color:rgba(0,0,0,.04)!important}.upcrop-upload-table thead td:first-of-type,.upcrop-upload-table thead th:first-of-type{padding-left:1.8em}.upcrop-upload-table thead td:last-of-type,.upcrop-upload-table thead th:last-of-type{padding-right:1.8em}.upcrop-upload-table thead td md-icon,.upcrop-upload-table thead th md-icon{height:16px;width:16px;line-height:16px;font-size:16px;vertical-align:bottom;margin-right:3px}.upcrop-upload-table tbody td,.upcrop-upload-table tbody th{border-color:rgba(0,0,0,.04)}.upcrop-upload-table tbody td:first-of-type,.upcrop-upload-table tbody th:first-of-type{padding-left:1.6em}.upcrop-upload-table tbody td:last-of-type,.upcrop-upload-table tbody th:last-of-type{padding-right:1.6em}.upcrop-upload-table thead td,.upcrop-upload-table thead th{color:rgba(0,0,0,.54);font-size:12px;font-weight:400;padding:1.3em .75em;border:none;border-width:0}.upcrop-upload-table tbody td{color:rgba(0,0,0,.87);padding:1em .75em;font-size:.9rem;font-weight:400}@media (max-width:800px){.upcrop-upload-table{vertical-align:top;max-width:100%;overflow-x:auto;white-space:nowrap;border-collapse:collapse;border-spacing:0;display:flex;overflow:hidden;background:0 0}.upcrop-upload-table .actions a{margin-top:-.35em}.upcrop-upload-table .is-pulled-right{float:none!important}.upcrop-upload-table thead{display:flex;flex-shrink:0;min-width:min-content}.upcrop-upload-table thead td,.upcrop-upload-table thead th{padding:1.3em 1.8em;text-align:right;width:100%!important}.upcrop-upload-table thead td md-icon,.upcrop-upload-table thead th md-icon{margin-right:0}.upcrop-upload-table tbody{flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1;-webkit-overflow-scrolling:touch;background:radial-gradient(left,ellipse,rgba(0,0,0,.2) 0,transparent 75%) 0 center,radial-gradient(right,ellipse,rgba(0,0,0,.2) 0,transparent 75%) 100% center;background-size:10px 100%,10px 100%;background-attachment:scroll,scroll;background-repeat:no-repeat;display:flex;position:relative;overflow-x:auto;overflow-y:hidden;margin-right:1.6em}.upcrop-upload-table tbody tr{flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1}.upcrop-upload-table tbody td,.upcrop-upload-table tbody th{padding:1.155em 1.6em;text-align:left!important}.upcrop-upload-table tbody td:first-of-type,.upcrop-upload-table tbody th:first-of-type{padding-left:1.6em}.upcrop-upload-table tbody td:last-of-type,.upcrop-upload-table tbody th:last-of-type{padding-right:1.6em}.upcrop-upload-table tr{display:flex;flex-direction:column;min-width:min-content;flex-shrink:0}.upcrop-upload-table td,.upcrop-upload-table th{display:block;background-image:none!important;border-left:0}.upcrop-upload-table td:first-child,.upcrop-upload-table th:first-child{background-image:linear-gradient(to right,#fff 50%,rgba(255,255,255,0) 100%);background-repeat:no-repeat;background-size:20px 100%}.upcrop-upload-table td:last-child,.upcrop-upload-table th:last-child{background-image:linear-gradient(to left,#fff 50%,rgba(255,255,255,0) 100%);background-repeat:no-repeat;background-position:100% 0;background-size:20px 100%}.upcrop-upload-table td:not(:last-child),.upcrop-upload-table th:not(:last-child){border-bottom:0}}.upcrop-upload-table ::-webkit-scrollbar{height:8px;overflow:visible;width:16px}.upcrop-upload-table ::-webkit-scrollbar-button{height:0;width:0}.upcrop-upload-table ::-webkit-scrollbar-corner{background:0 0}.upcrop-upload-table ::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.2);background-clip:padding-box;border:solid transparent;border-width:1px 1px 1px 6px;min-height:28px;padding:100px 0 0;-webkit-box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07);box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07)}.upcrop-upload-table ::-webkit-scrollbar-track{background-clip:padding-box;border:solid transparent;border-width:0 0 0 4px}[enterlist] [has-table]{margin-right:-24px;margin-left:-24px}[enterlist] [has-table] .upcrop-upload-table{background-color:transparent}[enterlist] [has-table] .upcrop-upload-table thead tr{background-color:rgba(0,0,0,.02)!important}[enterlist] [has-table] .upcrop-upload-table tr:hover{background-color:inherit}']
+                template: "<label ng2FileDrop multiple class=\"my-drop-zone\" [ngClass]=\"{'nv-file-over': hasFileOver}\" (fileOver)=\"onFileOver($event)\" [uploader]=\"uploader\" fxLayout fxLayoutAlign=\"center center\"> \u00C1rea de upload <input type=\"file\" ng2FileSelect multiple [uploader]=\"uploader\" style=\"display: none\"/></label><table class=\"table upcrop-upload-table\"> <thead> <tr> <th>Preview</th> <th>Arquivo</th> <th> <mat-icon class=\"is-pulled-right\">settings</mat-icon> </th> </tr></thead> <tbody> <tr *ngFor=\"let item of uploader.queue\"> <td style=\"width:120px\"> <img upcropImagePreview [image]=\"item?._file\" class=\"media-object\"/> </td><td>{{truncate(item?.file?.name, 16)}}</td><td class=\"actions\" style=\"width:53px\"> <a class=\"button is-small is-danger is-outlined\" (click)=\"item.remove()\"> <span class=\"icon is-small\"> <i class=\"fa fa-trash\"></i> </span> </a> </td></tr><tr [hidden]=\"uploader.queue.length\"> <td colspan=\"3\" class=\"has-text-danger\"> Nenhum arquivo, adicione acima. </td></tr></tbody></table>",
+                styles: ['.my-drop-zone{border:2px dashed rgba(0,0,0,.04);width:100%;display:flex;padding:20px;background-color:rgba(0,0,0,.04);color:rgba(0,0,0,.7)}.nv-file-over{border:2px dashed rgba(244,67,54,.4)}[upcropImagePreview]{display:block}.upcrop-upload-table{background-color:#fff;color:#363636}.upcrop-upload-table td,.upcrop-upload-table th{border:1px solid #dbdbdb;border-width:0 0 1px;padding:.5em .75em;vertical-align:top}.upcrop-upload-table td.is-white,.upcrop-upload-table th.is-white{background-color:#fff;border-color:#fff;color:#0a0a0a}.upcrop-upload-table td.is-black,.upcrop-upload-table th.is-black{background-color:#0a0a0a;border-color:#0a0a0a;color:#fff}.upcrop-upload-table td.is-light,.upcrop-upload-table th.is-light{background-color:#f5f5f5;border-color:#f5f5f5;color:#363636}.upcrop-upload-table td.is-dark,.upcrop-upload-table th.is-dark{background-color:#363636;border-color:#363636;color:#f5f5f5}.upcrop-upload-table td.is-primary,.upcrop-upload-table th.is-primary{background-color:#00d1b2;border-color:#00d1b2;color:#fff}.upcrop-upload-table td.is-info,.upcrop-upload-table th.is-info{background-color:#3273dc;border-color:#3273dc;color:#fff}.upcrop-upload-table td.is-success,.upcrop-upload-table th.is-success{background-color:#23d160;border-color:#23d160;color:#fff}.upcrop-upload-table td.is-warning,.upcrop-upload-table th.is-warning{background-color:#ffdd57;border-color:#ffdd57;color:rgba(0,0,0,.7)}.upcrop-upload-table td.is-danger,.upcrop-upload-table th.is-danger{background-color:#ff3860;border-color:#ff3860;color:#fff}.upcrop-upload-table td.is-narrow,.upcrop-upload-table th.is-narrow{white-space:nowrap;width:1%}.upcrop-upload-table th{color:#363636;text-align:left}.upcrop-upload-table tr:hover{background-color:#fafafa}.upcrop-upload-table tr.is-selected{background-color:#00d1b2;color:#fff}.upcrop-upload-table tr.is-selected a,.upcrop-upload-table tr.is-selected strong{color:currentColor}.upcrop-upload-table tr.is-selected td,.upcrop-upload-table tr.is-selected th{border-color:#fff;color:currentColor}.upcrop-upload-table thead td,.upcrop-upload-table thead th{color:#363636}.upcrop-upload-table tfoot td,.upcrop-upload-table tfoot th{border-width:2px 0 0;color:#363636}.upcrop-upload-table tbody tr:last-child td,.upcrop-upload-table tbody tr:last-child th{border-bottom-width:0}.upcrop-upload-table.is-bordered td,.upcrop-upload-table.is-bordered th{border-width:1px}.upcrop-upload-table.is-bordered tr:last-child td,.upcrop-upload-table.is-bordered tr:last-child th{border-bottom-width:1px}.upcrop-upload-table.is-fullwidth{width:100%}.upcrop-upload-table.is-narrow td,.upcrop-upload-table.is-narrow th{padding:.25em .5em}.upcrop-upload-table.is-striped tbody tr:not(.is-selected):nth-child(even){background-color:#fafafa}.upcrop-upload-table.is-striped tbody tr:not(.is-selected):nth-child(even):hover{background-color:#f5f5f5}td,th{padding:0;text-align:left}.upcrop-upload-table-search{display:flex;padding:1.3em 1.6em}.upcrop-upload-table-search input{font-size:14px;flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1;border:none;background-color:transparent;outline:-webkit-focus-ring-color auto 0!important}.upcrop-upload-table-search>mat-icon{margin-right:16px;margin-top:2px}[table-loading]{position:absolute;width:100%;margin-top:59px!important;background-color:rgba(255,255,255,.9);height:calc(100% - 59px);z-index:1}[table-no-entries]{padding:1.6em}.mat-card[has-table]{padding:0}.mat-card[has-table] .mat-card-actions{padding:8px!important;margin:0;border-top:1px solid #dbdbdb;border-color:rgba(0,0,0,.09)}.mat-card[has-table] .mat-card-actions .mat-icon-button{color:rgba(0,0,0,.54)}.mat-card[has-table] .mat-card-actions .mat-icon-button[disabled]{color:rgba(0,0,0,.18)}.mat-card[has-table] .mat-card-actions .mat-paginator-page-size-label{margin:0 15px;color:rgba(0,0,0,.54);font-size:12px;font-weight:400}.upcrop-upload-table{border-collapse:collapse;border-spacing:0;width:100%;margin-bottom:0}.upcrop-upload-table .actions .button{margin-bottom:-.25em;margin-top:-.15em}.upcrop-upload-table thead tr{background-color:rgba(0,0,0,.04)!important}.upcrop-upload-table thead td:first-of-type,.upcrop-upload-table thead th:first-of-type{padding-left:1.8em}.upcrop-upload-table thead td:last-of-type,.upcrop-upload-table thead th:last-of-type{padding-right:1.8em}.upcrop-upload-table thead td mat-icon,.upcrop-upload-table thead th mat-icon{height:16px;width:16px;line-height:16px;font-size:16px;vertical-align:bottom;margin-right:3px}.upcrop-upload-table tbody td,.upcrop-upload-table tbody th{border-color:rgba(0,0,0,.04)}.upcrop-upload-table tbody td:first-of-type,.upcrop-upload-table tbody th:first-of-type{padding-left:1.6em}.upcrop-upload-table tbody td:last-of-type,.upcrop-upload-table tbody th:last-of-type{padding-right:1.6em}.upcrop-upload-table thead td,.upcrop-upload-table thead th{color:rgba(0,0,0,.54);font-size:12px;font-weight:400;padding:1.3em .75em;border:none;border-width:0}.upcrop-upload-table tbody td{color:rgba(0,0,0,.87);padding:1em .75em;font-size:.9rem;font-weight:400}@media (max-width:800px){.upcrop-upload-table{vertical-align:top;max-width:100%;overflow-x:auto;white-space:nowrap;border-collapse:collapse;border-spacing:0;display:flex;overflow:hidden;background:0 0}.upcrop-upload-table .actions a{margin-top:-.35em}.upcrop-upload-table .is-pulled-right{float:none!important}.upcrop-upload-table thead{display:flex;flex-shrink:0;min-width:min-content}.upcrop-upload-table thead td,.upcrop-upload-table thead th{padding:1.3em 1.8em;text-align:right;width:100%!important}.upcrop-upload-table thead td mat-icon,.upcrop-upload-table thead th mat-icon{margin-right:0}.upcrop-upload-table tbody{flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1;-webkit-overflow-scrolling:touch;background:radial-gradient(left,ellipse,rgba(0,0,0,.2) 0,transparent 75%) 0 center,radial-gradient(right,ellipse,rgba(0,0,0,.2) 0,transparent 75%) 100% center;background-size:10px 100%,10px 100%;background-attachment:scroll,scroll;background-repeat:no-repeat;display:flex;position:relative;overflow-x:auto;overflow-y:hidden;margin-right:1.6em}.upcrop-upload-table tbody tr{flex:1 1 100%;box-sizing:border-box;-webkit-box-flex:1}.upcrop-upload-table tbody td,.upcrop-upload-table tbody th{padding:1.155em 1.6em;text-align:left!important}.upcrop-upload-table tbody td:first-of-type,.upcrop-upload-table tbody th:first-of-type{padding-left:1.6em}.upcrop-upload-table tbody td:last-of-type,.upcrop-upload-table tbody th:last-of-type{padding-right:1.6em}.upcrop-upload-table tr{display:flex;flex-direction:column;min-width:min-content;flex-shrink:0}.upcrop-upload-table td,.upcrop-upload-table th{display:block;background-image:none!important;border-left:0}.upcrop-upload-table td:first-child,.upcrop-upload-table th:first-child{background-image:linear-gradient(to right,#fff 50%,rgba(255,255,255,0) 100%);background-repeat:no-repeat;background-size:20px 100%}.upcrop-upload-table td:last-child,.upcrop-upload-table th:last-child{background-image:linear-gradient(to left,#fff 50%,rgba(255,255,255,0) 100%);background-repeat:no-repeat;background-position:100% 0;background-size:20px 100%}.upcrop-upload-table td:not(:last-child),.upcrop-upload-table th:not(:last-child){border-bottom:0}}.upcrop-upload-table ::-webkit-scrollbar{height:8px;overflow:visible;width:16px}.upcrop-upload-table ::-webkit-scrollbar-button{height:0;width:0}.upcrop-upload-table ::-webkit-scrollbar-corner{background:0 0}.upcrop-upload-table ::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.2);background-clip:padding-box;border:solid transparent;border-width:1px 1px 1px 6px;min-height:28px;padding:100px 0 0;-webkit-box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07);box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07)}.upcrop-upload-table ::-webkit-scrollbar-track{background-clip:padding-box;border:solid transparent;border-width:0 0 0 4px}[enterlist] [has-table]{margin-right:-24px;margin-left:-24px}[enterlist] [has-table] .upcrop-upload-table{background-color:transparent}[enterlist] [has-table] .upcrop-upload-table thead tr{background-color:rgba(0,0,0,.02)!important}[enterlist] [has-table] .upcrop-upload-table tr:hover{background-color:inherit}']
             },] },
@@ -315,3 +315,3 @@ ];
                 selector: 'app-upcrop-crop',
-                template: "<div main-loading [fxHide]=\"!uploading\"> <div class=\"spinner\"></div></div><div [hidden]=\"uploading\" class=\"upcrop-crop\"> <h2 class=\"has-text-centered mat-subheading-2\">Imagem{{currentNumber + 1}}de{{uploader?.queue?.length}}</h2> <div class=\"crop-image-container\"> <angular-cropper #angularCropper *ngIf=\"current && current._dataUrl\" [cropperOptions]=\"config\" [imageUrl]=\"current?._dataUrl\"></angular-cropper> </div><div class=\"crop-controls\" fxLayout fxLayoutAlign=\"center center\" fxLayoutWrap *ngIf=\"current && current._dataUrl\"> <button md-button (click)=\"zoomIn()\" class=\"md-icon-button\" aria-label=\"Aumentar zoom\" mdTooltip=\"Aumentar zoom\"> <md-icon>zoom_in</md-icon> </button> <button md-button (click)=\"zoomOut()\" class=\"md-icon-button\" aria-label=\"Diminuir zoom\" mdTooltip=\"Diminuir zoom\"> <md-icon>zoom_out</md-icon> </button> <button md-button (click)=\"goLeft()\" class=\"md-icon-button\" aria-label=\"Mover para esquerda\" mdTooltip=\"Mover para esquerda\"> <md-icon>keyboard_arrow_left</md-icon> </button> <button md-button (click)=\"goRight()\" class=\"md-icon-button\" aria-label=\"Mover para direita\" mdTooltip=\"Mover para direita\"> <md-icon>keyboard_arrow_right</md-icon> </button> <button md-button (click)=\"goUp()\" class=\"md-icon-button\" aria-label=\"Mover para cima\" mdTooltip=\"Mover para cima\"> <md-icon>keyboard_arrow_up</md-icon> </button> <button md-button (click)=\"goDown()\" class=\"md-icon-button\" aria-label=\"Mover para baixo\" mdTooltip=\"Mover para baixo\"> <md-icon>keyboard_arrow_down</md-icon> </button> <button md-button (click)=\"reset()\" class=\"md-icon-button md-primary\" aria-label=\"Restaurar imagem original\" mdTooltip=\"Restaurar imagem original\"> <md-icon>cached</md-icon> </button> </div></div>",
+                template: "<div main-loading [fxHide]=\"!uploading\"> <div class=\"spinner\"></div></div><div [hidden]=\"uploading\" class=\"upcrop-crop\"> <h2 class=\"has-text-centered mat-subheading-2\">Imagem{{currentNumber + 1}}de{{uploader?.queue?.length}}</h2> <div class=\"crop-image-container\"> <angular-cropper #angularCropper *ngIf=\"current && current._dataUrl\" [cropperOptions]=\"config\" [imageUrl]=\"current?._dataUrl\"></angular-cropper> </div><div class=\"crop-controls\" fxLayout fxLayoutAlign=\"center center\" fxLayoutWrap *ngIf=\"current && current._dataUrl\"> <button mat-button (click)=\"zoomIn()\" class=\"mat-icon-button\" aria-label=\"Aumentar zoom\" mdTooltip=\"Aumentar zoom\"> <mat-icon>zoom_in</mat-icon> </button> <button mat-button (click)=\"zoomOut()\" class=\"mat-icon-button\" aria-label=\"Diminuir zoom\" mdTooltip=\"Diminuir zoom\"> <mat-icon>zoom_out</mat-icon> </button> <button mat-button (click)=\"goLeft()\" class=\"mat-icon-button\" aria-label=\"Mover para esquerda\" mdTooltip=\"Mover para esquerda\"> <mat-icon>keyboard_arrow_left</mat-icon> </button> <button mat-button (click)=\"goRight()\" class=\"mat-icon-button\" aria-label=\"Mover para direita\" mdTooltip=\"Mover para direita\"> <mat-icon>keyboard_arrow_right</mat-icon> </button> <button mat-button (click)=\"goUp()\" class=\"mat-icon-button\" aria-label=\"Mover para cima\" mdTooltip=\"Mover para cima\"> <mat-icon>keyboard_arrow_up</mat-icon> </button> <button mat-button (click)=\"goDown()\" class=\"mat-icon-button\" aria-label=\"Mover para baixo\" mdTooltip=\"Mover para baixo\"> <mat-icon>keyboard_arrow_down</mat-icon> </button> <button mat-button (click)=\"reset()\" class=\"mat-icon-button mat-primary\" aria-label=\"Restaurar imagem original\" mdTooltip=\"Restaurar imagem original\"> <mat-icon>cached</mat-icon> </button> </div></div>",
                 styles: ['.crop-image-container{max-height:500px;width:100%}.crop-image-container img{max-width:100%;max-height:100%}.crop-controls{padding-top:20px;padding-bottom:20px}[main-loading]{min-height:120px;padding-top:34px;box-sizing:border-box;flex-direction:column;max-width:100%;place-content:center;align-items:center;display:flex}.upcrop-crop .has-text-centered{text-align:center!important}']
@@ -476,4 +476,4 @@ },] },
                 selector: 'app-upcrop-dialog',
-                template: "<h2 md-dialog-title class=\"has-text-danger\"> Upload de imagens <small>com corte</small></h2><md-dialog-content> <div steps> <div steps-content fxLayout=\"row\" fxLayoutAlign=\"start center\"> <button md-icon-button fxHide.xs [disabled]=\"!steps.current.previus || (steps.current.previusDisabled && steps.current.previusDisabled())\" (click)=\"steps.current.previusAction()\"> <md-icon>keyboard_arrow_left</md-icon> </button> <span fxFlex></span> <h3>Passo <b>{{steps.current.number}}</b> de <b>{{steps.total}}</b> / <span class=\"has-text-primary\">{{steps.current.label}}</span> </h3> <span fxFlex></span> <button md-icon-button fxHide.xs [disabled]=\"!steps.current.next || (steps.current.nextDisabled && steps.current.nextDisabled())\" (click)=\"steps.current.nextAction()\"> <md-icon>keyboard_arrow_right</md-icon> </button> </div></div><div class=\"step-1\" [hidden]=\"steps.current.number !=1\"> <app-upcrop-upload #upcropUpload [config]=\"data.uploadConfig\" (onUploadImage)=\"onUploadImage($event)\"></app-upcrop-upload> </div><div class=\"step-2\" [hidden]=\"steps.current.number !=2\"> <app-upcrop-crop #upcropCrop [config]=\"data.cropConfig\" (onCropImage)=\"onCropImage($event)\"></app-upcrop-crop> </div></md-dialog-content><md-dialog-actions *ngIf=\"steps.current.number==1\"> <button md-button md-dialog-close>Fechar</button> <button md-button color=\"primary\" [disabled]=\"!upcropUpload.uploader.queue.length\" (click)=\"goToStep2()\">Continuar</button></md-dialog-actions><md-dialog-actions *ngIf=\"steps.current.number==2\"> <button md-button (click)=\"goToStep1()\">Voltar</button> <button md-button color=\"primary\" [fxHide]=\"upcropCrop.uploader?.queue?.length==(upcropCrop.currentNumber + 1)\" (click)=\"upcropCrop.goToNextCrop()\">Pr\u00F3xima imagem</button> <button md-button color=\"primary\" [fxHide]=\"upcropCrop.uploader?.queue?.length > (upcropCrop.currentNumber + 1)\" [disabled]=\"upcropCrop.uploading\" (click)=\"finish()\">Concluir</button></md-dialog-actions>",
-                styles: ['[md-dialog-title] small{color:#b5b5b5!important;font:400 16px/28px Roboto,"Helvetica Neue",sans-serif!important;margin:0 0 16px!important}[steps]{margin:0 -24px 16px;padding-top:16px;padding-bottom:16px;background-color:rgba(0,0,0,.04)}[steps] .has-text-primary{color:#3f51b5!important}[md-dialog-title] .has-text-danger{color:#f44336!important}']
+                template: "<h2 mat-dialog-title class=\"has-text-danger\"> Upload de imagens <small>com corte</small></h2><mat-dialog-content> <div steps> <div steps-content fxLayout=\"row\" fxLayoutAlign=\"start center\"> <button mat-icon-button fxHide.xs [disabled]=\"!steps.current.previus || (steps.current.previusDisabled && steps.current.previusDisabled())\" (click)=\"steps.current.previusAction()\"> <mat-icon>keyboard_arrow_left</mat-icon> </button> <span fxFlex></span> <h3>Passo <b>{{steps.current.number}}</b> de <b>{{steps.total}}</b> / <span class=\"has-text-primary\">{{steps.current.label}}</span> </h3> <span fxFlex></span> <button mat-icon-button fxHide.xs [disabled]=\"!steps.current.next || (steps.current.nextDisabled && steps.current.nextDisabled())\" (click)=\"steps.current.nextAction()\"> <mat-icon>keyboard_arrow_right</mat-icon> </button> </div></div><div class=\"step-1\" [hidden]=\"steps.current.number !=1\"> <app-upcrop-upload #upcropUpload [config]=\"data.uploadConfig\" (onUploadImage)=\"onUploadImage($event)\"></app-upcrop-upload> </div><div class=\"step-2\" [hidden]=\"steps.current.number !=2\"> <app-upcrop-crop #upcropCrop [config]=\"data.cropConfig\" (onCropImage)=\"onCropImage($event)\"></app-upcrop-crop> </div></mat-dialog-content><mat-dialog-actions *ngIf=\"steps.current.number==1\"> <button mat-button mat-dialog-close>Fechar</button> <button mat-button color=\"primary\" [disabled]=\"!upcropUpload.uploader.queue.length\" (click)=\"goToStep2()\">Continuar</button></mat-dialog-actions><mat-dialog-actions *ngIf=\"steps.current.number==2\"> <button mat-button (click)=\"goToStep1()\">Voltar</button> <button mat-button color=\"primary\" [fxHide]=\"upcropCrop.uploader?.queue?.length==(upcropCrop.currentNumber + 1)\" (click)=\"upcropCrop.goToNextCrop()\">Pr\u00F3xima imagem</button> <button mat-button color=\"primary\" [fxHide]=\"upcropCrop.uploader?.queue?.length > (upcropCrop.currentNumber + 1)\" [disabled]=\"upcropCrop.uploading\" (click)=\"finish()\">Concluir</button></mat-dialog-actions>",
+                styles: ['[mat-dialog-title] small{color:#b5b5b5!important;font:400 16px/28px Roboto,"Helvetica Neue",sans-serif!important;margin:0 0 16px!important}[steps]{margin:0 -24px 16px;padding-top:16px;padding-bottom:16px;background-color:rgba(0,0,0,.04)}[steps] .has-text-primary{color:#3f51b5!important}[mat-dialog-title] .has-text-danger{color:#f44336!important}']
             },] },
@@ -480,0 +480,0 @@ ];

package.json

 {
   "name": "angular-upcrop",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "Library with upload and crop feature for Angular 4+",
@@ -5,0 +5,0 @@ "repository": {

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

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

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

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

94797

increased by0.18%

No dependency changes