@stemy/ngx-utils 19.2.1 → 19.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -6129,7 +6129,7 @@ class UploadComponent {
|
|
|
6129
6129
|
provide: NG_VALUE_ACCESSOR,
|
|
6130
6130
|
useExisting: forwardRef(() => UploadComponent),
|
|
6131
6131
|
multi: true,
|
|
6132
|
-
}], queries: [{ propertyName: "uploadButton", first: true, predicate: ["uploadButton"], descendants: true }, { propertyName: "removeButton", first: true, predicate: ["removeButton"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template #defaultUploadBtn let-loading=\"loading\">\r\n <a class=\"btn btn-primary\" [ngClass]=\"{loading: loading}\">\r\n {{ buttonText | translate }}\r\n </a>\r\n</ng-template>\r\n<ng-template #defaultRemoveBtn let-remove=\"remove\" let-index=\"index\">\r\n <a class=\"btn btn-danger btn-delete\" (click)=\"remove(index)\">\r\n x\r\n </a>\r\n</ng-template>\r\n\r\n<div class=\"upload\">\r\n <div class=\"upload-input\" [ngClass]=\"{'drop-allowed': dropAllowed}\">\r\n <input type=\"file\"\r\n #input\r\n [multiple]=\"multiple\"\r\n [accept]=\"acceptAttr\"\r\n (dragenter)=\"onDragEnter($event)\"\r\n (dragleave)=\"onDrop()\"\r\n (drop)=\"onDrop()\"\r\n (click)=\"onInputClick($event)\"\r\n (blur)=\"onTouched($event)\"\r\n (change)=\"onInputChange($event)\"/>\r\n <div class=\"process-container\">\r\n <div class=\"upload-process\"\r\n [ngStyle]=\"!proc.preview ? {} : {backgroundImage: proc.preview}\"\r\n *ngFor=\"let proc of processing\">\r\n <div class=\"upload-progress\">\r\n <div class=\"upload-progress-num\">{{ proc.progress }}%</div>\r\n <div class=\"upload-progress-bar\" [ngStyle]=\"{width: proc.progress + '%'}\">\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"btn-container\" (click)=\"input.click()\">\r\n <ng-container [ngTemplateOutlet]=\"uploadButton || defaultUploadBtn\"\r\n [ngTemplateOutletContext]=\"{loading: !!processing, buttonText: buttonText}\">\r\n </ng-container>\r\n </div>\r\n </div>\r\n <ng-template #defaultTemplate>\r\n <ul class=\"files\" *ngIf=\"!multiple\">\r\n <li class=\"file\" *ngIf=\"value\">\r\n <a [href]=\"getUrl(value) | safe: 'url'\" target=\"target\">\r\n <i class=\"fas fa-download\">download</i>\r\n </a>\r\n <ng-container [ngTemplateOutlet]=\"removeButton || defaultRemoveBtn\"\r\n [ngTemplateOutletContext]=\"{remove: remove}\">\r\n </ng-container>\r\n </li>\r\n </ul>\r\n <ul class=\"files\" *ngIf=\"multiple\">\r\n <li class=\"file\" *ngFor=\"let file of value; let
|
|
6132
|
+
}], queries: [{ propertyName: "uploadButton", first: true, predicate: ["uploadButton"], descendants: true }, { propertyName: "removeButton", first: true, predicate: ["removeButton"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template #defaultUploadBtn let-loading=\"loading\">\r\n <a class=\"btn btn-primary\" [ngClass]=\"{loading: loading}\">\r\n {{ buttonText | translate }}\r\n </a>\r\n</ng-template>\r\n<ng-template #defaultRemoveBtn let-remove=\"remove\" let-index=\"index\">\r\n <a class=\"btn btn-danger btn-delete\" (click)=\"remove(index)\">\r\n x\r\n </a>\r\n</ng-template>\r\n\r\n<div class=\"upload\">\r\n <div class=\"upload-input\" [ngClass]=\"{'drop-allowed': dropAllowed}\">\r\n <input type=\"file\"\r\n #input\r\n [multiple]=\"multiple\"\r\n [accept]=\"acceptAttr\"\r\n (dragenter)=\"onDragEnter($event)\"\r\n (dragleave)=\"onDrop()\"\r\n (drop)=\"onDrop()\"\r\n (click)=\"onInputClick($event)\"\r\n (blur)=\"onTouched($event)\"\r\n (change)=\"onInputChange($event)\"/>\r\n <div class=\"process-container\">\r\n <div class=\"upload-process\"\r\n [ngStyle]=\"!proc.preview ? {} : {backgroundImage: proc.preview}\"\r\n *ngFor=\"let proc of processing\">\r\n <div class=\"upload-progress\">\r\n <div class=\"upload-progress-num\">{{ proc.progress }}%</div>\r\n <div class=\"upload-progress-bar\" [ngStyle]=\"{width: proc.progress + '%'}\">\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"btn-container\" (click)=\"input.click()\">\r\n <ng-container [ngTemplateOutlet]=\"uploadButton || defaultUploadBtn\"\r\n [ngTemplateOutletContext]=\"{loading: !!processing, buttonText: buttonText}\">\r\n </ng-container>\r\n </div>\r\n </div>\r\n <ng-template #defaultTemplate>\r\n <ul class=\"files\" *ngIf=\"!multiple\">\r\n <li class=\"file\" *ngIf=\"value\">\r\n <a [href]=\"getUrl(value) | safe: 'url'\" target=\"target\">\r\n <i class=\"fas fa-download\">download</i>\r\n </a>\r\n <ng-container [ngTemplateOutlet]=\"removeButton || defaultRemoveBtn\"\r\n [ngTemplateOutletContext]=\"{remove: remove}\">\r\n </ng-container>\r\n </li>\r\n </ul>\r\n <ul class=\"files\" *ngIf=\"multiple\">\r\n <li class=\"file\" *ngFor=\"let file of value; let ix = index\">\r\n <a [href]=\"getUrl(file) | safe: 'url'\" [target]=\"'target_' + ix\">\r\n <i class=\"fas fa-download\"></i>\r\n </a>\r\n <ng-container [ngTemplateOutlet]=\"removeButton || defaultRemoveBtn\"\r\n [ngTemplateOutletContext]=\"{remove: remove, index: ix}\">\r\n </ng-container>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n <ng-container *ngIf=\"isImage; else defaultTemplate\">\r\n <ul class=\"images\" *ngIf=\"!multiple\">\r\n <li class=\"image\" *ngIf=\"value\">\r\n <img alt=\"file image\" [src]=\"getUrl(value) | safe: 'url'\"/>\r\n <ng-container [ngTemplateOutlet]=\"removeButton || defaultRemoveBtn\"\r\n [ngTemplateOutletContext]=\"{remove: remove}\">\r\n </ng-container>\r\n </li>\r\n </ul>\r\n <ul class=\"images\" *ngIf=\"multiple\">\r\n <li class=\"image\" *ngFor=\"let image of value; let ix = index\">\r\n <img alt=\"file image\" [src]=\"getUrl(image) | safe: 'url'\"/>\r\n <ng-container [ngTemplateOutlet]=\"removeButton || defaultRemoveBtn\"\r\n [ngTemplateOutletContext]=\"{remove: remove, index: ix}\">\r\n </ng-container>\r\n </li>\r\n </ul>\r\n </ng-container>\r\n</div>\r\n", styles: [".upload{--background: var(--primary-color, var(--mat-sys-primary, black));--text: var(--text-color, var(--mat-sys-on-primary, white))}.upload .upload-input{width:100%;border:2px #bfbfbf dashed;border-radius:10px;background-color:#0000000d;transition:.2s;flex-wrap:wrap;position:relative;padding:0 10px 10px}.upload .upload-input.drop-allowed{background-color:#00000080;border-color:#a9a9a9}.upload .upload-input input{display:block;position:absolute;inset:0;opacity:0}.upload .upload-input .process-container{min-height:120px;display:flex;gap:10px;flex-wrap:wrap;margin-bottom:8px}.upload .upload-input .upload-process{margin-top:10px;width:120px;height:120px;background:#00000080 center center no-repeat;background-size:cover;display:flex;align-items:center;justify-content:center}.upload .upload-input .upload-progress{position:relative;width:90%;height:15px;border:1px solid darkgrey;background:#ffffff80}.upload .upload-input .upload-progress-bar{position:absolute;height:15px;background:var(--background);top:0}.upload .upload-input .upload-progress-num{position:relative;z-index:1;font-size:12px;line-height:15px;text-align:center;color:var(--text)}.upload .images,.upload .files{list-style-type:none;margin:10px 0;padding:0;display:flex;gap:5px}.upload .images li,.upload .files li{position:relative}.upload .images li a,.upload .files li a{position:absolute;right:8px;top:8px}.upload .images img,.upload .files img{max-width:100%;max-height:200px;margin:2px;border-radius:5px}.upload .btn-select{display:inline-block;position:relative;cursor:pointer}.upload .btn-select button{display:inline-block;position:relative;z-index:1}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: SafeHtmlPipe, name: "safe" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
6133
6133
|
}
|
|
6134
6134
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: UploadComponent, decorators: [{
|
|
6135
6135
|
type: Component,
|
|
@@ -6137,7 +6137,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
|
|
|
6137
6137
|
provide: NG_VALUE_ACCESSOR,
|
|
6138
6138
|
useExisting: forwardRef(() => UploadComponent),
|
|
6139
6139
|
multi: true,
|
|
6140
|
-
}], template: "<ng-template #defaultUploadBtn let-loading=\"loading\">\r\n <a class=\"btn btn-primary\" [ngClass]=\"{loading: loading}\">\r\n {{ buttonText | translate }}\r\n </a>\r\n</ng-template>\r\n<ng-template #defaultRemoveBtn let-remove=\"remove\" let-index=\"index\">\r\n <a class=\"btn btn-danger btn-delete\" (click)=\"remove(index)\">\r\n x\r\n </a>\r\n</ng-template>\r\n\r\n<div class=\"upload\">\r\n <div class=\"upload-input\" [ngClass]=\"{'drop-allowed': dropAllowed}\">\r\n <input type=\"file\"\r\n #input\r\n [multiple]=\"multiple\"\r\n [accept]=\"acceptAttr\"\r\n (dragenter)=\"onDragEnter($event)\"\r\n (dragleave)=\"onDrop()\"\r\n (drop)=\"onDrop()\"\r\n (click)=\"onInputClick($event)\"\r\n (blur)=\"onTouched($event)\"\r\n (change)=\"onInputChange($event)\"/>\r\n <div class=\"process-container\">\r\n <div class=\"upload-process\"\r\n [ngStyle]=\"!proc.preview ? {} : {backgroundImage: proc.preview}\"\r\n *ngFor=\"let proc of processing\">\r\n <div class=\"upload-progress\">\r\n <div class=\"upload-progress-num\">{{ proc.progress }}%</div>\r\n <div class=\"upload-progress-bar\" [ngStyle]=\"{width: proc.progress + '%'}\">\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"btn-container\" (click)=\"input.click()\">\r\n <ng-container [ngTemplateOutlet]=\"uploadButton || defaultUploadBtn\"\r\n [ngTemplateOutletContext]=\"{loading: !!processing, buttonText: buttonText}\">\r\n </ng-container>\r\n </div>\r\n </div>\r\n <ng-template #defaultTemplate>\r\n <ul class=\"files\" *ngIf=\"!multiple\">\r\n <li class=\"file\" *ngIf=\"value\">\r\n <a [href]=\"getUrl(value) | safe: 'url'\" target=\"target\">\r\n <i class=\"fas fa-download\">download</i>\r\n </a>\r\n <ng-container [ngTemplateOutlet]=\"removeButton || defaultRemoveBtn\"\r\n [ngTemplateOutletContext]=\"{remove: remove}\">\r\n </ng-container>\r\n </li>\r\n </ul>\r\n <ul class=\"files\" *ngIf=\"multiple\">\r\n <li class=\"file\" *ngFor=\"let file of value; let
|
|
6140
|
+
}], template: "<ng-template #defaultUploadBtn let-loading=\"loading\">\r\n <a class=\"btn btn-primary\" [ngClass]=\"{loading: loading}\">\r\n {{ buttonText | translate }}\r\n </a>\r\n</ng-template>\r\n<ng-template #defaultRemoveBtn let-remove=\"remove\" let-index=\"index\">\r\n <a class=\"btn btn-danger btn-delete\" (click)=\"remove(index)\">\r\n x\r\n </a>\r\n</ng-template>\r\n\r\n<div class=\"upload\">\r\n <div class=\"upload-input\" [ngClass]=\"{'drop-allowed': dropAllowed}\">\r\n <input type=\"file\"\r\n #input\r\n [multiple]=\"multiple\"\r\n [accept]=\"acceptAttr\"\r\n (dragenter)=\"onDragEnter($event)\"\r\n (dragleave)=\"onDrop()\"\r\n (drop)=\"onDrop()\"\r\n (click)=\"onInputClick($event)\"\r\n (blur)=\"onTouched($event)\"\r\n (change)=\"onInputChange($event)\"/>\r\n <div class=\"process-container\">\r\n <div class=\"upload-process\"\r\n [ngStyle]=\"!proc.preview ? {} : {backgroundImage: proc.preview}\"\r\n *ngFor=\"let proc of processing\">\r\n <div class=\"upload-progress\">\r\n <div class=\"upload-progress-num\">{{ proc.progress }}%</div>\r\n <div class=\"upload-progress-bar\" [ngStyle]=\"{width: proc.progress + '%'}\">\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"btn-container\" (click)=\"input.click()\">\r\n <ng-container [ngTemplateOutlet]=\"uploadButton || defaultUploadBtn\"\r\n [ngTemplateOutletContext]=\"{loading: !!processing, buttonText: buttonText}\">\r\n </ng-container>\r\n </div>\r\n </div>\r\n <ng-template #defaultTemplate>\r\n <ul class=\"files\" *ngIf=\"!multiple\">\r\n <li class=\"file\" *ngIf=\"value\">\r\n <a [href]=\"getUrl(value) | safe: 'url'\" target=\"target\">\r\n <i class=\"fas fa-download\">download</i>\r\n </a>\r\n <ng-container [ngTemplateOutlet]=\"removeButton || defaultRemoveBtn\"\r\n [ngTemplateOutletContext]=\"{remove: remove}\">\r\n </ng-container>\r\n </li>\r\n </ul>\r\n <ul class=\"files\" *ngIf=\"multiple\">\r\n <li class=\"file\" *ngFor=\"let file of value; let ix = index\">\r\n <a [href]=\"getUrl(file) | safe: 'url'\" [target]=\"'target_' + ix\">\r\n <i class=\"fas fa-download\"></i>\r\n </a>\r\n <ng-container [ngTemplateOutlet]=\"removeButton || defaultRemoveBtn\"\r\n [ngTemplateOutletContext]=\"{remove: remove, index: ix}\">\r\n </ng-container>\r\n </li>\r\n </ul>\r\n </ng-template>\r\n <ng-container *ngIf=\"isImage; else defaultTemplate\">\r\n <ul class=\"images\" *ngIf=\"!multiple\">\r\n <li class=\"image\" *ngIf=\"value\">\r\n <img alt=\"file image\" [src]=\"getUrl(value) | safe: 'url'\"/>\r\n <ng-container [ngTemplateOutlet]=\"removeButton || defaultRemoveBtn\"\r\n [ngTemplateOutletContext]=\"{remove: remove}\">\r\n </ng-container>\r\n </li>\r\n </ul>\r\n <ul class=\"images\" *ngIf=\"multiple\">\r\n <li class=\"image\" *ngFor=\"let image of value; let ix = index\">\r\n <img alt=\"file image\" [src]=\"getUrl(image) | safe: 'url'\"/>\r\n <ng-container [ngTemplateOutlet]=\"removeButton || defaultRemoveBtn\"\r\n [ngTemplateOutletContext]=\"{remove: remove, index: ix}\">\r\n </ng-container>\r\n </li>\r\n </ul>\r\n </ng-container>\r\n</div>\r\n", styles: [".upload{--background: var(--primary-color, var(--mat-sys-primary, black));--text: var(--text-color, var(--mat-sys-on-primary, white))}.upload .upload-input{width:100%;border:2px #bfbfbf dashed;border-radius:10px;background-color:#0000000d;transition:.2s;flex-wrap:wrap;position:relative;padding:0 10px 10px}.upload .upload-input.drop-allowed{background-color:#00000080;border-color:#a9a9a9}.upload .upload-input input{display:block;position:absolute;inset:0;opacity:0}.upload .upload-input .process-container{min-height:120px;display:flex;gap:10px;flex-wrap:wrap;margin-bottom:8px}.upload .upload-input .upload-process{margin-top:10px;width:120px;height:120px;background:#00000080 center center no-repeat;background-size:cover;display:flex;align-items:center;justify-content:center}.upload .upload-input .upload-progress{position:relative;width:90%;height:15px;border:1px solid darkgrey;background:#ffffff80}.upload .upload-input .upload-progress-bar{position:absolute;height:15px;background:var(--background);top:0}.upload .upload-input .upload-progress-num{position:relative;z-index:1;font-size:12px;line-height:15px;text-align:center;color:var(--text)}.upload .images,.upload .files{list-style-type:none;margin:10px 0;padding:0;display:flex;gap:5px}.upload .images li,.upload .files li{position:relative}.upload .images li a,.upload .files li a{position:absolute;right:8px;top:8px}.upload .images img,.upload .files img{max-width:100%;max-height:200px;margin:2px;border-radius:5px}.upload .btn-select{display:inline-block;position:relative;cursor:pointer}.upload .btn-select button{display:inline-block;position:relative;z-index:1}\n"] }]
|
|
6141
6141
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
|
|
6142
6142
|
type: Inject,
|
|
6143
6143
|
args: [API_SERVICE]
|