@martyganz/mat-file-upload/bundles/martyganz-mat-file-upload.umd.js

A simple & configurable Angular Material file upload component.

(function (global, factory) {
    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@angular/material/button'), require('@angular/material/icon'), require('@angular/material/input'), require('@angular/material/select')) :
    typeof define === 'function' && define.amd ? define('@martyganz/mat-file-upload', ['exports', '@angular/core', '@angular/common', '@angular/forms', '@angular/material/button', '@angular/material/icon', '@angular/material/input', '@angular/material/select'], factory) :
    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.martyganz = global.martyganz || {}, global.martyganz['mat-file-upload'] = {}), global.ng.core, global.ng.common, global.ng.forms, global.ng.material.button, global.ng.material.icon, global.ng.material.input, global.ng.material.select));
}(this, (function (exports, i0, common, forms, button, icon, input, select) { 'use strict';

    function _interopNamespace(e) {
        if (e && e.__esModule) return e;
        var n = Object.create(null);
        if (e) {
            Object.keys(e).forEach(function (k) {
                if (k !== 'default') {
                    var d = Object.getOwnPropertyDescriptor(e, k);
                    Object.defineProperty(n, k, d.get ? d : {
                        enumerable: true,
                        get: function () {
                            return e[k];
                        }
                    });
                }
            });
        }
        n['default'] = e;
        return Object.freeze(n);
    }

    var i0__namespace = /*#__PURE__*/_interopNamespace(i0);

    var MatFileUploadService = /** @class */ (function () {
        function MatFileUploadService() {
        }
        return MatFileUploadService;
    }());
    MatFileUploadService.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function MatFileUploadService_Factory() { return new MatFileUploadService(); }, token: MatFileUploadService, providedIn: "root" });
    MatFileUploadService.decorators = [
        { type: i0.Injectable, args: [{
                    providedIn: 'root'
                },] }
    ];
    MatFileUploadService.ctorParameters = function () { return []; };

    var MatFileUploadComponent = /** @class */ (function () {
        function MatFileUploadComponent() {
            this.labelText = 'Select File(s)';
            this.selectButtonText = 'Select File(s)';
            this.selectFilesButtonType = 'button';
            this.uploadButtonText = 'Upload File(s)';
            this.uploadButtonType = 'button';
            this.allowMultipleFiles = false;
            this.showUploadButton = true;
            this.acceptedTypes = '*.*';
            this.customSvgIcon = null;
            this.uploadClicked = new i0.EventEmitter();
            this.selectedFilesChanged = new i0.EventEmitter();
            this.selectedFileText = '';
        }
        MatFileUploadComponent.prototype.filesChanged = function (files) {
            this.selectedFiles = files;
            this.selectedFilesChanged.emit(this.selectedFiles);
            if (this.selectedFiles) {
                var numSelectedFiles = this.selectedFiles.length;
                this.selectedFileText =
                    numSelectedFiles === 1
                        ? this.selectedFiles[0].name
                        : numSelectedFiles + " files selected";
            }
            else {
                this.selectedFileText = '';
                this.resetFileInput();
            }
        };
        MatFileUploadComponent.prototype.uploadFiles = function () {
            this.uploadClicked.emit(this.selectedFiles);
            this.resetFileInput();
        };
        MatFileUploadComponent.prototype.resetFileInput = function () {
            this.fileInputRef.nativeElement.value = '';
        };
        return MatFileUploadComponent;
    }());
    MatFileUploadComponent.decorators = [
        { type: i0.Component, args: [{
                    selector: 'mat-file-upload',
                    template: "\n    <span class=\"file-input-text\">{{ labelText }}</span>\n    <button\n      mat-button\n      [type]=\"selectFilesButtonType\"\n      color=\"primary\"\n      class=\"file-input-button\"\n      (click)=\"fileInput.click()\"\n      [attr.aria-label]=\"selectButtonText\"\n    >\n      <span>{{ selectButtonText }}</span>\n      <input\n        #fileInput\n        type=\"file\"\n        style=\"display: none\"\n        [accept]=\"acceptedTypes\"\n        [multiple]=\"allowMultipleFiles\"\n        (change)=\"filesChanged($event.target.files)\"\n      />\n    </button>\n    <button\n      mat-raised-button\n      [type]=\"uploadButtonType\"\n      color=\"primary\"\n      class=\"file-input-button\"\n      [disabled]=\"!selectedFiles\"\n      (click)=\"uploadFiles()\"\n      *ngIf=\"showUploadButton\"\n      [attr.aria-label]=\"uploadButtonText\"\n    >\n      {{ uploadButtonText }}\n    </button>\n    <span class=\"file-input-text\">{{ selectedFileText }}</span>\n    <button\n      mat-icon-button\n      (click)=\"filesChanged(null)\"\n      type=\"button\"\n      aria-label=\"Remove Selected File(s)\"\n       *ngIf=\"selectedFiles != null && selectedFiles.length > 0\"\n    >\n        <mat-icon *ngIf=\"!customSvgIcon\">close</mat-icon>\n        <mat-icon *ngIf=\"customSvgIcon\" [svgIcon]=\"customSvgIcon\"></mat-icon>\n    </button>\n  ",
                    styles: ['.file-input-button { margin-right: 8px !important }',
                        '.file-input-text { font-size: 14px !important; margin-right: 8px !important }']
                },] }
    ];
    MatFileUploadComponent.propDecorators = {
        labelText: [{ type: i0.Input }],
        selectButtonText: [{ type: i0.Input }],
        selectFilesButtonType: [{ type: i0.Input }],
        uploadButtonText: [{ type: i0.Input }],
        uploadButtonType: [{ type: i0.Input }],
        allowMultipleFiles: [{ type: i0.Input }],
        showUploadButton: [{ type: i0.Input }],
        acceptedTypes: [{ type: i0.Input }],
        customSvgIcon: [{ type: i0.Input }],
        uploadClicked: [{ type: i0.Output }],
        selectedFilesChanged: [{ type: i0.Output }],
        fileInputRef: [{ type: i0.ViewChild, args: ['fileInput',] }]
    };

    var MatFileUploadModule = /** @class */ (function () {
        function MatFileUploadModule() {
        }
        return MatFileUploadModule;
    }());
    MatFileUploadModule.decorators = [
        { type: i0.NgModule, args: [{
                    declarations: [MatFileUploadComponent],
                    imports: [
                        common.CommonModule,
                        button.MatButtonModule,
                        icon.MatIconModule,
                        input.MatInputModule,
                        select.MatSelectModule,
                        forms.FormsModule,
                    ],
                    exports: [MatFileUploadComponent],
                },] }
    ];

    /*
     * Public API Surface of mat-file-upload
     */

    /**
     * Generated bundle index. Do not edit.
     */

    exports.MatFileUploadComponent = MatFileUploadComponent;
    exports.MatFileUploadModule = MatFileUploadModule;
    exports.MatFileUploadService = MatFileUploadService;

    Object.defineProperty(exports, '__esModule', { value: true });

})));
//# sourceMappingURL=martyganz-mat-file-upload.umd.js.map