@nghacks/uploader
Version:
Image and file uploader for angular
609 lines (595 loc) • 31 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/forms'), require('@angular/common')) :
typeof define === 'function' && define.amd ? define('@nghacks/uploader', ['exports', '@angular/core', '@angular/forms', '@angular/common'], factory) :
(global = global || self, factory((global.nghacks = global.nghacks || {}, global.nghacks.uploader = {}), global.ng.core, global.ng.forms, global.ng.common));
}(this, (function (exports, core, forms, common) { 'use strict';
/*! *****************************************************************************
Copyright (c) Microsoft Corporation.
Permission to use, copy, modify, and/or distribute this software for any
purpose with or without fee is hereby granted.
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
PERFORMANCE OF THIS SOFTWARE.
***************************************************************************** */
/* global Reflect, Promise */
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b)
if (b.hasOwnProperty(p))
d[p] = b[p]; };
return extendStatics(d, b);
};
function __extends(d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
}
var __assign = function () {
__assign = Object.assign || function __assign(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s)
if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
function __rest(s, e) {
var t = {};
for (var p in s)
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
}
function __decorate(decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
r = Reflect.decorate(decorators, target, key, desc);
else
for (var i = decorators.length - 1; i >= 0; i--)
if (d = decorators[i])
r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
}
function __param(paramIndex, decorator) {
return function (target, key) { decorator(target, key, paramIndex); };
}
function __metadata(metadataKey, metadataValue) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
return Reflect.metadata(metadataKey, metadataValue);
}
function __awaiter(thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try {
step(generator.next(value));
}
catch (e) {
reject(e);
} }
function rejected(value) { try {
step(generator["throw"](value));
}
catch (e) {
reject(e);
} }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
}
function __generator(thisArg, body) {
var _ = { label: 0, sent: function () { if (t[0] & 1)
throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function () { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f)
throw new TypeError("Generator is already executing.");
while (_)
try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done)
return t;
if (y = 0, t)
op = [op[0] & 2, t.value];
switch (op[0]) {
case 0:
case 1:
t = op;
break;
case 4:
_.label++;
return { value: op[1], done: false };
case 5:
_.label++;
y = op[1];
op = [0];
continue;
case 7:
op = _.ops.pop();
_.trys.pop();
continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
_ = 0;
continue;
}
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) {
_.label = op[1];
break;
}
if (op[0] === 6 && _.label < t[1]) {
_.label = t[1];
t = op;
break;
}
if (t && _.label < t[2]) {
_.label = t[2];
_.ops.push(op);
break;
}
if (t[2])
_.ops.pop();
_.trys.pop();
continue;
}
op = body.call(thisArg, _);
}
catch (e) {
op = [6, e];
y = 0;
}
finally {
f = t = 0;
}
if (op[0] & 5)
throw op[1];
return { value: op[0] ? op[1] : void 0, done: true };
}
}
var __createBinding = Object.create ? (function (o, m, k, k2) {
if (k2 === undefined)
k2 = k;
Object.defineProperty(o, k2, { enumerable: true, get: function () { return m[k]; } });
}) : (function (o, m, k, k2) {
if (k2 === undefined)
k2 = k;
o[k2] = m[k];
});
function __exportStar(m, exports) {
for (var p in m)
if (p !== "default" && !exports.hasOwnProperty(p))
__createBinding(exports, m, p);
}
function __values(o) {
var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
if (m)
return m.call(o);
if (o && typeof o.length === "number")
return {
next: function () {
if (o && i >= o.length)
o = void 0;
return { value: o && o[i++], done: !o };
}
};
throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
}
function __read(o, n) {
var m = typeof Symbol === "function" && o[Symbol.iterator];
if (!m)
return o;
var i = m.call(o), r, ar = [], e;
try {
while ((n === void 0 || n-- > 0) && !(r = i.next()).done)
ar.push(r.value);
}
catch (error) {
e = { error: error };
}
finally {
try {
if (r && !r.done && (m = i["return"]))
m.call(i);
}
finally {
if (e)
throw e.error;
}
}
return ar;
}
function __spread() {
for (var ar = [], i = 0; i < arguments.length; i++)
ar = ar.concat(__read(arguments[i]));
return ar;
}
function __spreadArrays() {
for (var s = 0, i = 0, il = arguments.length; i < il; i++)
s += arguments[i].length;
for (var r = Array(s), k = 0, i = 0; i < il; i++)
for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
r[k] = a[j];
return r;
}
;
function __await(v) {
return this instanceof __await ? (this.v = v, this) : new __await(v);
}
function __asyncGenerator(thisArg, _arguments, generator) {
if (!Symbol.asyncIterator)
throw new TypeError("Symbol.asyncIterator is not defined.");
var g = generator.apply(thisArg, _arguments || []), i, q = [];
return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
function verb(n) { if (g[n])
i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
function resume(n, v) { try {
step(g[n](v));
}
catch (e) {
settle(q[0][3], e);
} }
function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
function fulfill(value) { resume("next", value); }
function reject(value) { resume("throw", value); }
function settle(f, v) { if (f(v), q.shift(), q.length)
resume(q[0][0], q[0][1]); }
}
function __asyncDelegator(o) {
var i, p;
return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === "return" } : f ? f(v) : v; } : f; }
}
function __asyncValues(o) {
if (!Symbol.asyncIterator)
throw new TypeError("Symbol.asyncIterator is not defined.");
var m = o[Symbol.asyncIterator], i;
return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
function settle(resolve, reject, d, v) { Promise.resolve(v).then(function (v) { resolve({ value: v, done: d }); }, reject); }
}
function __makeTemplateObject(cooked, raw) {
if (Object.defineProperty) {
Object.defineProperty(cooked, "raw", { value: raw });
}
else {
cooked.raw = raw;
}
return cooked;
}
;
var __setModuleDefault = Object.create ? (function (o, v) {
Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function (o, v) {
o["default"] = v;
};
function __importStar(mod) {
if (mod && mod.__esModule)
return mod;
var result = {};
if (mod != null)
for (var k in mod)
if (Object.hasOwnProperty.call(mod, k))
__createBinding(result, mod, k);
__setModuleDefault(result, mod);
return result;
}
function __importDefault(mod) {
return (mod && mod.__esModule) ? mod : { default: mod };
}
function __classPrivateFieldGet(receiver, privateMap) {
if (!privateMap.has(receiver)) {
throw new TypeError("attempted to get private field on non-instance");
}
return privateMap.get(receiver);
}
function __classPrivateFieldSet(receiver, privateMap, value) {
if (!privateMap.has(receiver)) {
throw new TypeError("attempted to set private field on non-instance");
}
privateMap.set(receiver, value);
return value;
}
var UploaderService = /** @class */ (function () {
function UploaderService() {
}
UploaderService.prototype.getBase64 = function (file) {
var reader = new FileReader();
reader.readAsDataURL(file);
return new Promise(function (resolve) {
reader.onload = function (event) {
var res = event.target.result;
var base64Image = res.split(',');
return resolve(base64Image);
};
});
};
return UploaderService;
}());
UploaderService.decorators = [
{ type: core.Injectable }
];
UploaderService.ctorParameters = function () { return []; };
var BaseUploaderComponent = /** @class */ (function () {
function BaseUploaderComponent(_uploaderService) {
this._uploaderService = _uploaderService;
this.fileInputChange = new core.EventEmitter();
this.formCtrl = new forms.FormControl();
/**
* @description maximum file size in kb (kilobyte)
* @default 5000 (5mb)
*/
this.maxSize = 5000;
/**
* @description min-height of the picker
* @default 48 (in pixel)
*/
this.minHeight = 48;
}
// Dragover listener
BaseUploaderComponent.prototype.onDragOver = function (evt) {
evt.preventDefault();
evt.stopPropagation();
this.dragover = true;
};
// Dragleave listener
BaseUploaderComponent.prototype.onDragLeave = function (evt) {
evt.preventDefault();
evt.stopPropagation();
this.dragover = false;
};
// Drop listener
BaseUploaderComponent.prototype.ondrop = function (evt) {
evt.preventDefault();
evt.stopPropagation();
if (evt.dataTransfer.files && evt.dataTransfer.files[0]) {
this.addFile(evt.dataTransfer.files[0]);
}
this.dragover = false;
};
// Choose listener
BaseUploaderComponent.prototype.inputChange = function (event) {
return __awaiter(this, void 0, void 0, function () {
return __generator(this, function (_a) {
if (event.target.files && event.target.files[0]) {
this.addFile(event.target.files[0]);
}
return [2 /*return*/];
});
});
};
BaseUploaderComponent.prototype.addFile = function (file) {
return __awaiter(this, void 0, void 0, function () {
var errors, fileName, base64Image;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (!file) {
return [2 /*return*/];
}
if (this.formCtrl.disabled) {
return [2 /*return*/];
}
errors = this.validate(file);
fileName = file.name;
return [4 /*yield*/, this._uploaderService.getBase64(file)];
case 1:
base64Image = _a.sent();
this.fileInputChangeStore = {
hasFile: true,
fileName: fileName,
errors: errors,
base64Image: base64Image
};
this.fileInputChange.emit(this.fileInputChangeStore);
this.formCtrl.setValue(base64Image);
return [2 /*return*/];
}
});
});
};
BaseUploaderComponent.prototype.validate = function (file) {
var e_1, _a;
var isSizeValid = true;
if ((file.size / 1000) > this.maxSize) {
isSizeValid = false;
}
var isTypeValid = false;
try {
for (var _b = __values(this.accept), _c = _b.next(); !_c.done; _c = _b.next()) {
var type = _c.value;
if (type.split('.')[1] === file.type.split('/')[1]) {
isTypeValid = true;
}
}
}
catch (e_1_1) { e_1 = { error: e_1_1 }; }
finally {
try {
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
}
finally { if (e_1) throw e_1.error; }
}
return this.getError(isSizeValid, isTypeValid);
};
BaseUploaderComponent.prototype.getError = function (size, type) {
var errors;
if (size && type) {
errors = {
maxSizeExceeded: null,
wrongFileType: null
};
}
else if (!size && type) {
errors = {
maxSizeExceeded: true,
wrongFileType: null
};
}
else if (size && !type) {
errors = {
maxSizeExceeded: null,
wrongFileType: true
};
}
else {
errors = {
wrongFileType: true,
maxSizeExceeded: true
};
}
return errors;
};
BaseUploaderComponent.prototype.getImageHeightWidth = function (base64Image) {
var _this = this;
return new Promise(function (resolve) { return __awaiter(_this, void 0, void 0, function () {
var image;
return __generator(this, function (_a) {
image = new Image();
image.src = base64Image;
image.onload = function () {
return resolve({
height: image.height,
width: image.width
});
};
return [2 /*return*/];
});
}); });
};
BaseUploaderComponent.prototype.removeFile = function () {
this.fileInputChangeStore = {
hasFile: false,
fileName: null,
errors: null,
base64Image: null
};
this.fileInputChange.emit(this.fileInputChangeStore);
this.formCtrl.setValue('');
};
return BaseUploaderComponent;
}());
BaseUploaderComponent.decorators = [
{ type: core.Component, args: [{ template: '' },] }
];
BaseUploaderComponent.ctorParameters = function () { return [
{ type: UploaderService }
]; };
BaseUploaderComponent.propDecorators = {
fileInputChange: [{ type: core.Output }],
pickerLabel: [{ type: core.Input }],
hint: [{ type: core.Input }],
accept: [{ type: core.Input }],
maxSize: [{ type: core.Input }],
disabled: [{ type: core.Input }],
minHeight: [{ type: core.Input }],
onDragOver: [{ type: core.HostListener, args: ['dragover', ['$event'],] }],
onDragLeave: [{ type: core.HostListener, args: ['dragleave', ['$event'],] }],
ondrop: [{ type: core.HostListener, args: ['drop', ['$event'],] }]
};
var FileUploaderComponent = /** @class */ (function (_super) {
__extends(FileUploaderComponent, _super);
function FileUploaderComponent() {
var _this = _super.apply(this, __spread(arguments)) || this;
/**
* @default 'Drag file, or Choose''
*/
_this.pickerLabel = 'Drag file, or Choose';
/**
* @default ['.pdf', '.csv', '.doc', '.docx','.docx', '.xlsx', '.cer']
*/
_this.accept = ['.pdf', '.csv', '.doc', '.docx', '.docx', '.xlsx', '.cer'];
return _this;
}
return FileUploaderComponent;
}(BaseUploaderComponent));
FileUploaderComponent.decorators = [
{ type: core.Component, args: [{
selector: 'file-uploader',
template: "<div class=\"uploader file-preview\"\n [ngStyle]=\"{\n 'min-height': minHeight+'px'\n }\"\n [ngClass]=\"{\n 'dragover': dragover,\n 'disabled': disabled\n }\">\n\n <div\n (click)=\"uploader.click()\"\n class=\"file\"\n *ngIf=\"formCtrl.value; else nofile\">\n <span class=\"file-name\">{{fileInputChangeStore.fileName}}</span>\n </div>\n\n <ng-template #nofile>\n <button class=\"picker\" type=\"button\" (click)=\"uploader.click()\">\n {{pickerLabel}}\n </button>\n </ng-template>\n\n <div class=\"cross\" *ngIf=\"formCtrl.value\">\n <button type=\"button\" (click)=\"removeFile()\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M16.3394 9.32245C16.7434 8.94589 16.7657 8.31312 16.3891 7.90911C16.0126 7.50509 15.3798 7.48283 14.9758 7.85938L12.0497 10.5866L9.32245 7.66048C8.94589 7.25647 8.31312 7.23421 7.90911 7.61076C7.50509 7.98731 7.48283 8.62008 7.85938 9.0241L10.5866 11.9502L7.66048 14.6775C7.25647 15.054 7.23421 15.6868 7.61076 16.0908C7.98731 16.4948 8.62008 16.5171 9.0241 16.1405L11.9502 13.4133L14.6775 16.3394C15.054 16.7434 15.6868 16.7657 16.0908 16.3891C16.4948 16.0126 16.5171 15.3798 16.1405 14.9758L13.4133 12.0497L16.3394 9.32245Z\"\n fill=\"currentColor\" />\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n d=\"M1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12ZM12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12C21 16.9706 16.9706 21 12 21Z\"\n fill=\"currentColor\" />\n </svg>\n </button>\n </div>\n\n <div class=\"hint\" *ngIf=\"hint\">\n <span>{{hint}}</span>\n </div>\n\n</div>\n\n\n<!-- Image Input -->\n<input #uploader type='file' style=\"display: none;\" [accept]=\"accept\" [disabled]=\"disabled\"\n (change)=\"inputChange($event);uploader.value=''\">\n",
styles: ["button{background:none;border:none;cursor:pointer;outline:none;padding:0}.uploader{border:1px solid #e0e0e0;border-radius:5px;box-sizing:border-box;margin-bottom:25px;min-height:48px;position:relative;transition:all .2s;width:100%}.uploader.dragover,.uploader:hover{background-color:#e4e4e4;border:1px dashed #1b7937}.uploader .cross{position:absolute;right:10px;top:10px}.uploader .picker{align-items:center;bottom:0;display:flex;height:100%;justify-content:center;left:0;padding:10px;position:absolute;right:0;top:0;width:100%}.uploader .hint{bottom:-25px;font-size:12px;left:0;position:absolute}.uploader.disabled{background-color:initial;border:1px dashed #b8b6b6;color:#b8b6b6}.uploader.disabled .picker{cursor:not-allowed!important}.uploader.disabled .cross,.uploader.disabled .hint{display:none}.uploader.file-preview{cursor:pointer;position:relative}.uploader.file-preview .file{align-items:center;box-sizing:border-box;display:flex;height:100%;justify-content:center;overflow:hidden;padding:10px;position:absolute;width:100%}.uploader.file-preview .file .file-name{font-weight:700;overflow:hidden;text-align:center;text-overflow:ellipsis;white-space:nowrap;width:100%}"]
},] }
];
FileUploaderComponent.propDecorators = {
pickerLabel: [{ type: core.Input }],
accept: [{ type: core.Input }]
};
var ImgUploaderComponent = /** @class */ (function (_super) {
__extends(ImgUploaderComponent, _super);
function ImgUploaderComponent() {
var _this = _super.apply(this, __spread(arguments)) || this;
/**
* @default 'Drag image, or Choose'
*/
_this.pickerLabel = 'Drag image, or Choose';
/**
* @default ['.jpg', '.png', '.jpeg']
*/
_this.accept = ['.jpg', '.png', '.jpeg'];
/**
* @description max-height of the image previewer
* @memberof ImgUploaderComponent
*/
_this.maxHeight = 250;
return _this;
}
return ImgUploaderComponent;
}(BaseUploaderComponent));
ImgUploaderComponent.decorators = [
{ type: core.Component, args: [{
selector: 'img-uploader',
template: "<div class=\"uploader image-preview\"\n [ngStyle]=\"{\n 'min-height': minHeight+'px'\n }\"\n [ngClass]=\"{\n 'dragover': dragover,\n 'disabled': disabled\n }\">\n\n <div\n (click)=\"uploader.click()\"\n class=\"image\"\n [ngStyle]=\"{\n 'max-height': maxHeight+'px'\n }\"\n *ngIf=\"formCtrl.value; else nofile\">\n\n <img\n [ngStyle]=\"{\n 'max-height': (maxHeight-(10*2))+'px'\n }\"\n [src]=\"formCtrl.value\" />\n\n </div>\n\n <ng-template #nofile>\n <button class=\"picker\" type=\"button\" (click)=\"uploader.click()\">\n {{pickerLabel}}\n </button>\n </ng-template>\n\n <div class=\"cross\" *ngIf=\"formCtrl.value\">\n <button type=\"button\" (click)=\"removeFile()\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M16.3394 9.32245C16.7434 8.94589 16.7657 8.31312 16.3891 7.90911C16.0126 7.50509 15.3798 7.48283 14.9758 7.85938L12.0497 10.5866L9.32245 7.66048C8.94589 7.25647 8.31312 7.23421 7.90911 7.61076C7.50509 7.98731 7.48283 8.62008 7.85938 9.0241L10.5866 11.9502L7.66048 14.6775C7.25647 15.054 7.23421 15.6868 7.61076 16.0908C7.98731 16.4948 8.62008 16.5171 9.0241 16.1405L11.9502 13.4133L14.6775 16.3394C15.054 16.7434 15.6868 16.7657 16.0908 16.3891C16.4948 16.0126 16.5171 15.3798 16.1405 14.9758L13.4133 12.0497L16.3394 9.32245Z\"\n fill=\"currentColor\" />\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n d=\"M1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12ZM12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12C21 16.9706 16.9706 21 12 21Z\"\n fill=\"currentColor\" />\n </svg>\n </button>\n </div>\n\n <div class=\"hint\" *ngIf=\"hint\">\n <span>{{hint}}</span>\n </div>\n\n</div>\n\n\n<!-- Image Input -->\n<input #uploader type='file' style=\"display: none;\" [accept]=\"accept\" [disabled]=\"disabled\"\n (change)=\"inputChange($event);uploader.value=''\">\n",
styles: ["button{background:none;border:none;cursor:pointer;outline:none;padding:0}.uploader{border:1px solid #e0e0e0;border-radius:5px;box-sizing:border-box;margin-bottom:25px;min-height:48px;position:relative;transition:all .2s;width:100%}.uploader.dragover,.uploader:hover{background-color:#e4e4e4;border:1px dashed #1b7937}.uploader .cross{position:absolute;right:10px;top:10px}.uploader .picker{align-items:center;bottom:0;display:flex;height:100%;justify-content:center;left:0;padding:10px;position:absolute;right:0;top:0;width:100%}.uploader .hint{bottom:-25px;font-size:12px;left:0;position:absolute}.uploader.disabled{background-color:initial;border:1px dashed #b8b6b6;color:#b8b6b6}.uploader.disabled .picker{cursor:not-allowed!important}.uploader.disabled .cross,.uploader.disabled .hint{display:none}.uploader.image-preview{cursor:pointer;position:relative}.uploader.image-preview .image{align-items:center;box-sizing:border-box;display:flex;justify-content:center;padding:10px}.uploader.image-preview .image img{height:100%!important;max-width:100%;width:auto}"]
},] }
];
ImgUploaderComponent.propDecorators = {
pickerLabel: [{ type: core.Input }],
accept: [{ type: core.Input }],
maxHeight: [{ type: core.Input }]
};
var UploaderModule = /** @class */ (function () {
function UploaderModule() {
}
return UploaderModule;
}());
UploaderModule.decorators = [
{ type: core.NgModule, args: [{
declarations: [
ImgUploaderComponent,
FileUploaderComponent
],
imports: [
common.CommonModule
],
providers: [UploaderService],
exports: [
ImgUploaderComponent,
FileUploaderComponent
],
},] }
];
/*
* Public API Surface of uploader
*/
/**
* Generated bundle index. Do not edit.
*/
exports.FileUploaderComponent = FileUploaderComponent;
exports.ImgUploaderComponent = ImgUploaderComponent;
exports.UploaderModule = UploaderModule;
exports.ɵa = BaseUploaderComponent;
exports.ɵb = UploaderService;
Object.defineProperty(exports, '__esModule', { value: true });
})));
//# sourceMappingURL=nghacks-uploader.umd.js.map