UNPKG

primeng

Version:

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/primeng.svg)](https://badge.fury.io/js/primeng) [![npm downloads](https://img.shields.io/npm/dm/primeng.sv

1 lines 17 kB
{"__symbolic":"module","version":4,"metadata":{"FileUpload":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":15,"character":1},"arguments":[{"selector":"p-fileUpload","template":"\n <div [ngClass]=\"'p-fileupload p-fileupload-advanced p-component'\" [ngStyle]=\"style\" [class]=\"styleClass\" *ngIf=\"mode === 'advanced'\">\n <div class=\"p-fileupload-buttonbar\">\n <span class=\"p-button p-component p-fileupload-choose\" [ngClass]=\"{'p-focus': focus, 'p-disabled':disabled || isChooseDisabled()}\" (focus)=\"onFocus()\" (blur)=\"onBlur()\" pRipple\n (click)=\"choose()\" (keydown.enter)=\"choose()\" tabindex=\"0\"> \n <input #advancedfileinput type=\"file\" (change)=\"onFileSelect($event)\" [multiple]=\"multiple\" [accept]=\"accept\" [disabled]=\"disabled || isChooseDisabled()\" [attr.title]=\"''\">\n <span [ngClass]=\"'p-button-icon p-button-icon-left'\" [class]=\"chooseIcon\"></span>\n <span class=\"p-button-label\">{{chooseButtonLabel}}</span>\n </span>\n\n <p-button *ngIf=\"!auto&&showUploadButton\" type=\"button\" [label]=\"uploadButtonLabel\" [icon]=\"uploadIcon\" (onClick)=\"upload()\" [disabled]=\"!hasFiles() || isFileLimitExceeded()\"></p-button>\n <p-button *ngIf=\"!auto&&showCancelButton\" type=\"button\" [label]=\"cancelButtonLabel\" [icon]=\"cancelIcon\" (onClick)=\"clear()\" [disabled]=\"!hasFiles() || uploading\"></p-button>\n\n <ng-container *ngTemplateOutlet=\"toolbarTemplate\"></ng-container>\n </div>\n <div #content class=\"p-fileupload-content\" (dragenter)=\"onDragEnter($event)\" (dragleave)=\"onDragLeave($event)\" (drop)=\"onDrop($event)\">\n <p-progressBar [value]=\"progress\" [showValue]=\"false\" *ngIf=\"hasFiles()\"></p-progressBar>\n\n <p-messages [value]=\"msgs\" [enableService]=\"false\"></p-messages>\n\n <div class=\"p-fileupload-files\" *ngIf=\"hasFiles()\">\n <div *ngIf=\"!fileTemplate\">\n <div class=\"p-fileupload-row\" *ngFor=\"let file of files; let i = index;\">\n <div><img [src]=\"file.objectURL\" *ngIf=\"isImage(file)\" [width]=\"previewWidth\" /></div>\n <div>{{file.name}}</div>\n <div>{{formatSize(file.size)}}</div>\n <div>\n <button type=\"button\" icon=\"pi pi-times\" pButton (click)=\"remove($event,i)\" [disabled]=\"uploading\"></button>\n </div>\n </div>\n </div>\n <div *ngIf=\"fileTemplate\">\n <ng-template ngFor [ngForOf]=\"files\" [ngForTemplate]=\"fileTemplate\"></ng-template>\n </div>\n </div>\n <ng-container *ngTemplateOutlet=\"contentTemplate; context: {$implicit: files}\"></ng-container>\n </div>\n </div>\n <div class=\"p-fileupload p-fileupload-basic p-component\" *ngIf=\"mode === 'basic'\">\n <p-messages [value]=\"msgs\" [enableService]=\"false\"></p-messages>\n <span [ngClass]=\"{'p-button p-component p-fileupload-choose': true, 'p-button-icon-only': !chooseLabel, 'p-fileupload-choose-selected': hasFiles(),'p-focus': focus, 'p-disabled':disabled}\"\n [ngStyle]=\"style\" [class]=\"styleClass\" (mouseup)=\"onBasicUploaderClick()\" (keydown)=\"onBasicUploaderClick()\" tabindex=\"0\" pRipple>\n <span class=\"p-button-icon p-button-icon-left pi\" [ngClass]=\"hasFiles()&&!auto ? uploadIcon : chooseIcon\"></span>\n <span class=\"p-button-label\">{{auto ? chooseLabel : hasFiles() ? files[0].name : chooseLabel}}</span>\n <input #basicfileinput type=\"file\" [accept]=\"accept\" [multiple]=\"multiple\" [disabled]=\"disabled\"\n (change)=\"onFileSelect($event)\" *ngIf=\"!hasFiles()\" (focus)=\"onFocus()\" (blur)=\"onBlur()\">\n </span>\n </div>\n ","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":66,"character":21},"member":"OnPush"},"encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":67,"character":19},"member":"None"},"styles":[".p-fileupload-content{position:relative}.p-fileupload-row{align-items:center;display:flex}.p-fileupload-row>div{flex:1 1 auto;width:25%}.p-fileupload-row>div:last-child{text-align:right}.p-fileupload-content .p-progressbar{left:0;position:absolute;top:0;width:100%}.p-button.p-fileupload-choose{overflow:hidden;position:relative}.p-button.p-fileupload-choose input[type=file],.p-fileupload-choose.p-fileupload-choose-selected input[type=file]{display:none}.p-fluid .p-fileupload .p-button{width:auto}"]}]}],"members":{"name":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":72,"character":5}}]}],"url":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":74,"character":5}}]}],"method":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":76,"character":5}}]}],"multiple":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":78,"character":5}}]}],"accept":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":80,"character":5}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":82,"character":5}}]}],"auto":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":84,"character":5}}]}],"withCredentials":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":86,"character":5}}]}],"maxFileSize":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":88,"character":5}}]}],"invalidFileSizeMessageSummary":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":90,"character":5}}]}],"invalidFileSizeMessageDetail":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":92,"character":5}}]}],"invalidFileTypeMessageSummary":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":94,"character":5}}]}],"invalidFileTypeMessageDetail":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":96,"character":5}}]}],"invalidFileLimitMessageDetail":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":98,"character":5}}]}],"invalidFileLimitMessageSummary":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":100,"character":5}}]}],"style":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":102,"character":5}}]}],"styleClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":104,"character":5}}]}],"previewWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":106,"character":5}}]}],"chooseLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":108,"character":5}}]}],"uploadLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":110,"character":5}}]}],"cancelLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":112,"character":5}}]}],"chooseIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":114,"character":5}}]}],"uploadIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":116,"character":5}}]}],"cancelIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":118,"character":5}}]}],"showUploadButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":120,"character":5}}]}],"showCancelButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":122,"character":5}}]}],"mode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":124,"character":5}}]}],"headers":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":126,"character":5}}]}],"customUpload":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":128,"character":5}}]}],"fileLimit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":130,"character":5}}]}],"onBeforeUpload":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":132,"character":5}}]}],"onSend":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":134,"character":5}}]}],"onUpload":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":136,"character":5}}]}],"onError":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":138,"character":5}}]}],"onClear":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":140,"character":5}}]}],"onRemove":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":142,"character":5}}]}],"onSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":144,"character":5}}]}],"onProgress":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":146,"character":5}}]}],"uploadHandler":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":148,"character":5}}]}],"templates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":150,"character":5},"arguments":[{"__symbolic":"reference","module":"primeng/api","name":"PrimeTemplate","line":150,"character":21}]}]}],"advancedFileInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":152,"character":5},"arguments":["advancedfileinput"]}]}],"basicFileInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":154,"character":5},"arguments":["basicfileinput"]}]}],"content":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":156,"character":5},"arguments":["content"]}]}],"files":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":158,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":202,"character":28},{"__symbolic":"reference","module":"@angular/platform-browser","name":"DomSanitizer","line":202,"character":58},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":202,"character":85},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":202,"character":107},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":202,"character":130},{"__symbolic":"reference","module":"primeng/api","name":"PrimeNGConfig","line":202,"character":164}]}],"ngAfterContentInit":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"choose":[{"__symbolic":"method"}],"onFileSelect":[{"__symbolic":"method"}],"isFileSelected":[{"__symbolic":"method"}],"isIE11":[{"__symbolic":"method"}],"validate":[{"__symbolic":"method"}],"isFileTypeValid":[{"__symbolic":"method"}],"getTypeClass":[{"__symbolic":"method"}],"isWildcard":[{"__symbolic":"method"}],"getFileExtension":[{"__symbolic":"method"}],"isImage":[{"__symbolic":"method"}],"onImageLoad":[{"__symbolic":"method"}],"upload":[{"__symbolic":"method"}],"clear":[{"__symbolic":"method"}],"remove":[{"__symbolic":"method"}],"isFileLimitExceeded":[{"__symbolic":"method"}],"isChooseDisabled":[{"__symbolic":"method"}],"checkFileLimit":[{"__symbolic":"method"}],"clearInputElement":[{"__symbolic":"method"}],"clearIEInput":[{"__symbolic":"method"}],"hasFiles":[{"__symbolic":"method"}],"onDragEnter":[{"__symbolic":"method"}],"onDragOver":[{"__symbolic":"method"}],"onDragLeave":[{"__symbolic":"method"}],"onDrop":[{"__symbolic":"method"}],"onFocus":[{"__symbolic":"method"}],"onBlur":[{"__symbolic":"method"}],"formatSize":[{"__symbolic":"method"}],"onBasicUploaderClick":[{"__symbolic":"method"}],"getBlockableElement":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"FileUploadModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":576,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":577,"character":14},{"__symbolic":"reference","module":"primeng/api","name":"SharedModule","line":577,"character":27},{"__symbolic":"reference","module":"primeng/button","name":"ButtonModule","line":577,"character":40},{"__symbolic":"reference","module":"primeng/progressbar","name":"ProgressBarModule","line":577,"character":53},{"__symbolic":"reference","module":"primeng/messages","name":"MessagesModule","line":577,"character":71},{"__symbolic":"reference","module":"primeng/ripple","name":"RippleModule","line":577,"character":86}],"exports":[{"__symbolic":"reference","name":"FileUpload"},{"__symbolic":"reference","module":"primeng/api","name":"SharedModule","line":578,"character":25},{"__symbolic":"reference","module":"primeng/button","name":"ButtonModule","line":578,"character":38},{"__symbolic":"reference","module":"primeng/progressbar","name":"ProgressBarModule","line":578,"character":51},{"__symbolic":"reference","module":"primeng/messages","name":"MessagesModule","line":578,"character":69}],"declarations":[{"__symbolic":"reference","name":"FileUpload"}]}]}],"members":{}}},"origins":{"FileUpload":"./fileupload","FileUploadModule":"./fileupload"},"importAs":"primeng/fileupload"}