@tilde-nlp/ngx-common 1.0.2 → 1.0.3
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.
- package/esm2020/lib/directives/drag-and-drop/drag-and-drop.directive.mjs +62 -0
- package/esm2020/lib/directives/drag-and-drop/drag-and-drop.module.mjs +26 -0
- package/esm2020/lib/directives/drag-and-drop/index.mjs +3 -0
- package/esm2020/lib/directives/index.mjs +2 -1
- package/esm2020/lib/file-upload/file-upload.component.mjs +4 -3
- package/esm2020/lib/file-upload/file-upload.module.mjs +8 -4
- package/esm2020/lib/filter-bar/filter-bar.component.mjs +14 -6
- package/esm2020/lib/filter-bar/filter-bar.module.mjs +8 -4
- package/esm2020/lib/filter-bar/models/filter-bar-settings.model.mjs +1 -1
- package/esm2020/lib/notification-message/notification-message.component.mjs +2 -2
- package/fesm2015/tilde-nlp-ngx-common.mjs +112 -16
- package/fesm2015/tilde-nlp-ngx-common.mjs.map +1 -1
- package/fesm2020/tilde-nlp-ngx-common.mjs +111 -16
- package/fesm2020/tilde-nlp-ngx-common.mjs.map +1 -1
- package/lib/directives/drag-and-drop/drag-and-drop.directive.d.ts +14 -0
- package/lib/directives/drag-and-drop/drag-and-drop.module.d.ts +8 -0
- package/lib/directives/drag-and-drop/index.d.ts +2 -0
- package/lib/directives/index.d.ts +1 -0
- package/lib/file-upload/file-upload.module.d.ts +2 -1
- package/lib/filter-bar/filter-bar.component.d.ts +8 -2
- package/lib/filter-bar/filter-bar.module.d.ts +2 -1
- package/lib/filter-bar/models/filter-bar-settings.model.d.ts +9 -0
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, Directive, Input, HostListener, NgModule, Component, Pipe, EventEmitter, Output, ViewChild, ElementRef } from '@angular/core';
|
|
2
|
+
import { Injectable, Directive, Input, HostListener, NgModule, Component, Pipe, EventEmitter, Output, HostBinding, ViewChild, ElementRef } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/material/icon';
|
|
4
4
|
import * as i2 from '@angular/platform-browser';
|
|
5
5
|
import * as i5 from '@angular/common';
|
|
@@ -23,9 +23,9 @@ import { MatFormFieldModule } from '@angular/material/form-field';
|
|
|
23
23
|
import * as i2$3 from '@angular/material/select';
|
|
24
24
|
import { MatSelectModule } from '@angular/material/select';
|
|
25
25
|
import * as i3$1 from '@angular/material/core';
|
|
26
|
-
import * as
|
|
26
|
+
import * as i7 from '@angular/material/input';
|
|
27
27
|
import { MatInputModule } from '@angular/material/input';
|
|
28
|
-
import * as
|
|
28
|
+
import * as i8 from '@angular/forms';
|
|
29
29
|
import { FormsModule } from '@angular/forms';
|
|
30
30
|
|
|
31
31
|
class IconService {
|
|
@@ -415,6 +415,88 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImpor
|
|
|
415
415
|
}]
|
|
416
416
|
}] });
|
|
417
417
|
|
|
418
|
+
class DragAndDropDirective {
|
|
419
|
+
constructor(element) {
|
|
420
|
+
this.element = element;
|
|
421
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
422
|
+
this.fileDropped = new EventEmitter();
|
|
423
|
+
}
|
|
424
|
+
get disabled() { return this.element.nativeElement.disabled; }
|
|
425
|
+
// Dragover listener
|
|
426
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
427
|
+
onDragOver(evt) {
|
|
428
|
+
evt.preventDefault();
|
|
429
|
+
evt.stopPropagation();
|
|
430
|
+
this.active = !this.disabled;
|
|
431
|
+
}
|
|
432
|
+
// Dragleave listener
|
|
433
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
434
|
+
onDragLeave(evt) {
|
|
435
|
+
evt.preventDefault();
|
|
436
|
+
evt.stopPropagation();
|
|
437
|
+
this.active = false;
|
|
438
|
+
}
|
|
439
|
+
// Drop listener
|
|
440
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
441
|
+
ondrop(evt) {
|
|
442
|
+
evt.preventDefault();
|
|
443
|
+
evt.stopPropagation();
|
|
444
|
+
this.active = false;
|
|
445
|
+
if (this.disabled) {
|
|
446
|
+
return;
|
|
447
|
+
}
|
|
448
|
+
const files = evt.dataTransfer.files;
|
|
449
|
+
if (files.length > 0) {
|
|
450
|
+
this.fileDropped.emit(files);
|
|
451
|
+
}
|
|
452
|
+
}
|
|
453
|
+
}
|
|
454
|
+
DragAndDropDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: DragAndDropDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
455
|
+
DragAndDropDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.3", type: DragAndDropDirective, selector: "[tldDragAndDrop]", outputs: { fileDropped: "fileDropped" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "ondrop($event)" }, properties: { "class.tld-file-over": "this.active" } }, ngImport: i0 });
|
|
456
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: DragAndDropDirective, decorators: [{
|
|
457
|
+
type: Directive,
|
|
458
|
+
args: [{
|
|
459
|
+
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
460
|
+
selector: '[tldDragAndDrop]'
|
|
461
|
+
}]
|
|
462
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { active: [{
|
|
463
|
+
type: HostBinding,
|
|
464
|
+
args: ['class.tld-file-over']
|
|
465
|
+
}], fileDropped: [{
|
|
466
|
+
type: Output
|
|
467
|
+
}], onDragOver: [{
|
|
468
|
+
type: HostListener,
|
|
469
|
+
args: ['dragover', ['$event']]
|
|
470
|
+
}], onDragLeave: [{
|
|
471
|
+
type: HostListener,
|
|
472
|
+
args: ['dragleave', ['$event']]
|
|
473
|
+
}], ondrop: [{
|
|
474
|
+
type: HostListener,
|
|
475
|
+
args: ['drop', ['$event']]
|
|
476
|
+
}] } });
|
|
477
|
+
|
|
478
|
+
class DragAndDropModule {
|
|
479
|
+
}
|
|
480
|
+
DragAndDropModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: DragAndDropModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
481
|
+
DragAndDropModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: DragAndDropModule, declarations: [DragAndDropDirective], imports: [CommonModule], exports: [DragAndDropDirective] });
|
|
482
|
+
DragAndDropModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: DragAndDropModule, imports: [[
|
|
483
|
+
CommonModule
|
|
484
|
+
]] });
|
|
485
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: DragAndDropModule, decorators: [{
|
|
486
|
+
type: NgModule,
|
|
487
|
+
args: [{
|
|
488
|
+
declarations: [
|
|
489
|
+
DragAndDropDirective
|
|
490
|
+
],
|
|
491
|
+
imports: [
|
|
492
|
+
CommonModule
|
|
493
|
+
],
|
|
494
|
+
exports: [
|
|
495
|
+
DragAndDropDirective
|
|
496
|
+
]
|
|
497
|
+
}]
|
|
498
|
+
}] });
|
|
499
|
+
|
|
418
500
|
class CloseButtonComponent {
|
|
419
501
|
constructor() {
|
|
420
502
|
// any type because emitter doesn't really need a value
|
|
@@ -501,10 +583,10 @@ class NotificationMessageComponent {
|
|
|
501
583
|
}
|
|
502
584
|
}
|
|
503
585
|
NotificationMessageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: NotificationMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
504
|
-
NotificationMessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: NotificationMessageComponent, selector: "lib-tld-notification-message", inputs: { message: "message", inline: "inline" }, outputs: { buttonClicked: "buttonClicked", closeClicked: "closeClicked", linkClicked: "linkClicked" }, ngImport: i0, template: "<div class=\"notification-message {{className}}\">\r\n <div class=\"notification-message-container tld-default-border\" [ngClass.lt-md]=\"'mobile'\" [class.inline]=\"inline\"\r\n fxLayout=\"row\" fxLayoutAlign=\"start start\" [attr.id]=\"message.id\" aria-live=\"polite\" fxLayout=\"row\">\r\n <span class=\"material-icons message-icon\">\r\n {{iconNames[message.type]}}\r\n </span>\r\n <div class=\"items-container\" fxFlex>\r\n <div fxLayout=\"row\">\r\n <div class=\"text-container\" fxFlex>\r\n <h1 *ngIf=\"message.title\" class=\"message-title\"\r\n [innerHtml]=\"message.title | translate: message.localizationParams\"></h1>\r\n <p *ngIf=\"message.body\" class=\"message-body\">\r\n <span [innerHtml]=\"message.body | translate: message.localizationParams\"></span>\r\n <span *ngIf=\"message.support\" [innerHtml]=\"message.support | translate: message.localizationParams\"></span>\r\n </p>\r\n </div>\r\n <tld-close-button *ngIf=\"!message.hideClose\" class=\"close-button\" (tldClick)=\"closeClick()\">\r\n </tld-close-button>\r\n </div>\r\n <div fxLayout=\"row\" fxLayoutGap=\"16px\" fxLayoutAlign=\"start center\"\r\n *ngIf=\"message.buttonText || message.linkHref || message.routerLink\">\r\n <button class=\"message-action-button\" color=\"accent\" mat-flat-button *ngIf=\"message.buttonText\"\r\n (click)=\"buttonClick()\">{{message.buttonText | translate}} </button>\r\n <a class=\"message-action-link\" *ngIf=\"message.linkHref && message.linkText\" (click)=\"linkClick()\"\r\n [attr.href]=\"message.linkHref\">{{message.linkText |\r\n translate}}</a>\r\n <a class=\"message-action-link\" *ngIf=\"message.routerLink && message.linkText\" (click)=\"linkClick()\"\r\n [routerLink]=\"[message.routerLink]\">{{message.linkText |\r\n translate}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".notification-message.basic .notification-message-container{background-color:var(--base-100);border-color:var(--base-100)}.notification-message.basic .notification-message-container .message-icon{color:var(--base-40)}.notification-message.basic .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.error .notification-message-container{background-color:var(--error-light);border-color:var(--base-100)}.notification-message.error .notification-message-container .message-icon{color:var(--error-dark)}.notification-message.error .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.warning .notification-message-container{background-color:var(--warning-light);border-color:var(--base-100)}.notification-message.warning .notification-message-container .message-icon{color:var(--warning-dark)}.notification-message.warning .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.success .notification-message-container{background-color:var(--success-light);border-color:var(--base-100)}.notification-message.success .notification-message-container .message-icon{color:var(--success-dark)}.notification-message.success .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message .notification-message-container{border:1px solid var(--base-95);border-radius:.5em}.notification-message .notification-message-container.mobile{padding:.6em .4em!important}.notification-message .notification-message-container.mobile .items-container{margin-left:.4em!important}.notification-message .notification-message-container.mobile .items-container div+div{margin-top:.2em!important}.notification-message .notification-message-container.mobile .items-container .message-title+.message-body{margin-top:0!important}.notification-message .notification-message-container .text-container:first-child{line-height:1.5em}.notification-message .notification-message-container .text-container .message-title{font-weight:500;margin:0}.notification-message .notification-message-container .text-container .message-body{margin:0}.notification-message .notification-message-container:not(.inline){padding:1.5em}.notification-message .notification-message-container:not(.inline) .items-container{margin-left:1em}.notification-message .notification-message-container:not(.inline) .items-container div+div,.notification-message .notification-message-container:not(.inline) .items-container .message-title+.message-body{margin-top:1em}.notification-message .notification-message-container:not(.inline) .message-title{font-size:1.25em}.notification-message .notification-message-container:not(.inline) .message-body{line-height:1.5em}.notification-message .notification-message-container.inline{padding:.75em 1em}.notification-message .notification-message-container.inline .items-container{margin-left:.75em}.notification-message .notification-message-container.inline .items-container div+div{margin-top:.5em}.notification-message .notification-message-container.inline .items-container .message-title+.message-body{margin-top:.2em}.notification-message .notification-message-container.inline .message-title{font-size:1em}\n"], components: [{ type: CloseButtonComponent, selector: "tld-close-button", inputs: ["ariaCode", "disabled", "tooltip"], outputs: ["tldClick"] }, { type: i2$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i4.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i6.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], pipes: { "translate": i1$1.TranslatePipe } });
|
|
586
|
+
NotificationMessageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: NotificationMessageComponent, selector: "lib-tld-notification-message", inputs: { message: "message", inline: "inline" }, outputs: { buttonClicked: "buttonClicked", closeClicked: "closeClicked", linkClicked: "linkClicked" }, ngImport: i0, template: "<div class=\"notification-message {{className}}\">\r\n <div class=\"notification-message-container tld-default-border\" [ngClass.lt-md]=\"'mobile'\" [class.inline]=\"inline\"\r\n fxLayout=\"row\" fxLayoutAlign=\"start start\" [attr.id]=\"message.id\" aria-live=\"polite\" fxLayout=\"row\">\r\n <span class=\"material-icons message-icon\">\r\n {{iconNames[message.type]}}\r\n </span>\r\n <div class=\"items-container\" fxFlex>\r\n <div fxLayout=\"row\">\r\n <div class=\"text-container\" fxFlex>\r\n <h1 *ngIf=\"message.title\" class=\"message-title\"\r\n [innerHtml]=\"message.title | translate: message.localizationParams\"></h1>\r\n <p *ngIf=\"message.body\" class=\"message-body\">\r\n <span [innerHtml]=\"message.body | translate: message.localizationParams\"></span>\r\n <span *ngIf=\"message.support\" [innerHtml]=\"message.support | translate: message.localizationParams\"></span>\r\n </p>\r\n </div>\r\n <tld-close-button *ngIf=\"!message.hideClose\" class=\"close-button\" (tldClick)=\"closeClick()\">\r\n </tld-close-button>\r\n </div>\r\n <div fxLayout=\"row\" fxLayoutGap=\"16px\" fxLayoutAlign=\"start center\"\r\n *ngIf=\"message.buttonText || message.linkHref || message.routerLink\">\r\n <button class=\"message-action-button\" color=\"accent\" mat-flat-button *ngIf=\"message.buttonText\"\r\n (click)=\"buttonClick()\">{{message.buttonText | translate}} </button>\r\n <a class=\"message-action-link\" *ngIf=\"message.linkHref && message.linkText\" (click)=\"linkClick()\"\r\n [attr.href]=\"message.linkHref\">{{message.linkText |\r\n translate}}</a>\r\n <a class=\"message-action-link\" *ngIf=\"message.routerLink && message.linkText\" (click)=\"linkClick()\"\r\n [routerLink]=\"[message.routerLink]\">{{message.linkText |\r\n translate}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [":host{display:inline-block;width:100%}.notification-message.basic .notification-message-container{background-color:var(--base-100);border-color:var(--base-100)}.notification-message.basic .notification-message-container .message-icon{color:var(--base-40)}.notification-message.basic .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.error .notification-message-container{background-color:var(--error-light);border-color:var(--base-100)}.notification-message.error .notification-message-container .message-icon{color:var(--error-dark)}.notification-message.error .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.warning .notification-message-container{background-color:var(--warning-light);border-color:var(--base-100)}.notification-message.warning .notification-message-container .message-icon{color:var(--warning-dark)}.notification-message.warning .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.success .notification-message-container{background-color:var(--success-light);border-color:var(--base-100)}.notification-message.success .notification-message-container .message-icon{color:var(--success-dark)}.notification-message.success .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message .notification-message-container{border:1px solid var(--base-95);border-radius:.5em}.notification-message .notification-message-container.mobile{padding:.6em .4em!important}.notification-message .notification-message-container.mobile .items-container{margin-left:.4em!important}.notification-message .notification-message-container.mobile .items-container div+div{margin-top:.2em!important}.notification-message .notification-message-container.mobile .items-container .message-title+.message-body{margin-top:0!important}.notification-message .notification-message-container .text-container:first-child{line-height:1.5em}.notification-message .notification-message-container .text-container .message-title{font-weight:500;margin:0}.notification-message .notification-message-container .text-container .message-body{margin:0}.notification-message .notification-message-container:not(.inline){padding:1.5em}.notification-message .notification-message-container:not(.inline) .items-container{margin-left:1em}.notification-message .notification-message-container:not(.inline) .items-container div+div,.notification-message .notification-message-container:not(.inline) .items-container .message-title+.message-body{margin-top:1em}.notification-message .notification-message-container:not(.inline) .message-title{font-size:1.25em}.notification-message .notification-message-container:not(.inline) .message-body{line-height:1.5em}.notification-message .notification-message-container.inline{padding:.75em 1em}.notification-message .notification-message-container.inline .items-container{margin-left:.75em}.notification-message .notification-message-container.inline .items-container div+div{margin-top:.5em}.notification-message .notification-message-container.inline .items-container .message-title+.message-body{margin-top:.2em}.notification-message .notification-message-container.inline .message-title{font-size:1em}\n"], components: [{ type: CloseButtonComponent, selector: "tld-close-button", inputs: ["ariaCode", "disabled", "tooltip"], outputs: ["tldClick"] }, { type: i2$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i4.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i6.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }], pipes: { "translate": i1$1.TranslatePipe } });
|
|
505
587
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: NotificationMessageComponent, decorators: [{
|
|
506
588
|
type: Component,
|
|
507
|
-
args: [{ selector: 'lib-tld-notification-message', template: "<div class=\"notification-message {{className}}\">\r\n <div class=\"notification-message-container tld-default-border\" [ngClass.lt-md]=\"'mobile'\" [class.inline]=\"inline\"\r\n fxLayout=\"row\" fxLayoutAlign=\"start start\" [attr.id]=\"message.id\" aria-live=\"polite\" fxLayout=\"row\">\r\n <span class=\"material-icons message-icon\">\r\n {{iconNames[message.type]}}\r\n </span>\r\n <div class=\"items-container\" fxFlex>\r\n <div fxLayout=\"row\">\r\n <div class=\"text-container\" fxFlex>\r\n <h1 *ngIf=\"message.title\" class=\"message-title\"\r\n [innerHtml]=\"message.title | translate: message.localizationParams\"></h1>\r\n <p *ngIf=\"message.body\" class=\"message-body\">\r\n <span [innerHtml]=\"message.body | translate: message.localizationParams\"></span>\r\n <span *ngIf=\"message.support\" [innerHtml]=\"message.support | translate: message.localizationParams\"></span>\r\n </p>\r\n </div>\r\n <tld-close-button *ngIf=\"!message.hideClose\" class=\"close-button\" (tldClick)=\"closeClick()\">\r\n </tld-close-button>\r\n </div>\r\n <div fxLayout=\"row\" fxLayoutGap=\"16px\" fxLayoutAlign=\"start center\"\r\n *ngIf=\"message.buttonText || message.linkHref || message.routerLink\">\r\n <button class=\"message-action-button\" color=\"accent\" mat-flat-button *ngIf=\"message.buttonText\"\r\n (click)=\"buttonClick()\">{{message.buttonText | translate}} </button>\r\n <a class=\"message-action-link\" *ngIf=\"message.linkHref && message.linkText\" (click)=\"linkClick()\"\r\n [attr.href]=\"message.linkHref\">{{message.linkText |\r\n translate}}</a>\r\n <a class=\"message-action-link\" *ngIf=\"message.routerLink && message.linkText\" (click)=\"linkClick()\"\r\n [routerLink]=\"[message.routerLink]\">{{message.linkText |\r\n translate}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".notification-message.basic .notification-message-container{background-color:var(--base-100);border-color:var(--base-100)}.notification-message.basic .notification-message-container .message-icon{color:var(--base-40)}.notification-message.basic .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.error .notification-message-container{background-color:var(--error-light);border-color:var(--base-100)}.notification-message.error .notification-message-container .message-icon{color:var(--error-dark)}.notification-message.error .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.warning .notification-message-container{background-color:var(--warning-light);border-color:var(--base-100)}.notification-message.warning .notification-message-container .message-icon{color:var(--warning-dark)}.notification-message.warning .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.success .notification-message-container{background-color:var(--success-light);border-color:var(--base-100)}.notification-message.success .notification-message-container .message-icon{color:var(--success-dark)}.notification-message.success .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message .notification-message-container{border:1px solid var(--base-95);border-radius:.5em}.notification-message .notification-message-container.mobile{padding:.6em .4em!important}.notification-message .notification-message-container.mobile .items-container{margin-left:.4em!important}.notification-message .notification-message-container.mobile .items-container div+div{margin-top:.2em!important}.notification-message .notification-message-container.mobile .items-container .message-title+.message-body{margin-top:0!important}.notification-message .notification-message-container .text-container:first-child{line-height:1.5em}.notification-message .notification-message-container .text-container .message-title{font-weight:500;margin:0}.notification-message .notification-message-container .text-container .message-body{margin:0}.notification-message .notification-message-container:not(.inline){padding:1.5em}.notification-message .notification-message-container:not(.inline) .items-container{margin-left:1em}.notification-message .notification-message-container:not(.inline) .items-container div+div,.notification-message .notification-message-container:not(.inline) .items-container .message-title+.message-body{margin-top:1em}.notification-message .notification-message-container:not(.inline) .message-title{font-size:1.25em}.notification-message .notification-message-container:not(.inline) .message-body{line-height:1.5em}.notification-message .notification-message-container.inline{padding:.75em 1em}.notification-message .notification-message-container.inline .items-container{margin-left:.75em}.notification-message .notification-message-container.inline .items-container div+div{margin-top:.5em}.notification-message .notification-message-container.inline .items-container .message-title+.message-body{margin-top:.2em}.notification-message .notification-message-container.inline .message-title{font-size:1em}\n"] }]
|
|
589
|
+
args: [{ selector: 'lib-tld-notification-message', template: "<div class=\"notification-message {{className}}\">\r\n <div class=\"notification-message-container tld-default-border\" [ngClass.lt-md]=\"'mobile'\" [class.inline]=\"inline\"\r\n fxLayout=\"row\" fxLayoutAlign=\"start start\" [attr.id]=\"message.id\" aria-live=\"polite\" fxLayout=\"row\">\r\n <span class=\"material-icons message-icon\">\r\n {{iconNames[message.type]}}\r\n </span>\r\n <div class=\"items-container\" fxFlex>\r\n <div fxLayout=\"row\">\r\n <div class=\"text-container\" fxFlex>\r\n <h1 *ngIf=\"message.title\" class=\"message-title\"\r\n [innerHtml]=\"message.title | translate: message.localizationParams\"></h1>\r\n <p *ngIf=\"message.body\" class=\"message-body\">\r\n <span [innerHtml]=\"message.body | translate: message.localizationParams\"></span>\r\n <span *ngIf=\"message.support\" [innerHtml]=\"message.support | translate: message.localizationParams\"></span>\r\n </p>\r\n </div>\r\n <tld-close-button *ngIf=\"!message.hideClose\" class=\"close-button\" (tldClick)=\"closeClick()\">\r\n </tld-close-button>\r\n </div>\r\n <div fxLayout=\"row\" fxLayoutGap=\"16px\" fxLayoutAlign=\"start center\"\r\n *ngIf=\"message.buttonText || message.linkHref || message.routerLink\">\r\n <button class=\"message-action-button\" color=\"accent\" mat-flat-button *ngIf=\"message.buttonText\"\r\n (click)=\"buttonClick()\">{{message.buttonText | translate}} </button>\r\n <a class=\"message-action-link\" *ngIf=\"message.linkHref && message.linkText\" (click)=\"linkClick()\"\r\n [attr.href]=\"message.linkHref\">{{message.linkText |\r\n translate}}</a>\r\n <a class=\"message-action-link\" *ngIf=\"message.routerLink && message.linkText\" (click)=\"linkClick()\"\r\n [routerLink]=\"[message.routerLink]\">{{message.linkText |\r\n translate}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [":host{display:inline-block;width:100%}.notification-message.basic .notification-message-container{background-color:var(--base-100);border-color:var(--base-100)}.notification-message.basic .notification-message-container .message-icon{color:var(--base-40)}.notification-message.basic .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.error .notification-message-container{background-color:var(--error-light);border-color:var(--base-100)}.notification-message.error .notification-message-container .message-icon{color:var(--error-dark)}.notification-message.error .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.warning .notification-message-container{background-color:var(--warning-light);border-color:var(--base-100)}.notification-message.warning .notification-message-container .message-icon{color:var(--warning-dark)}.notification-message.warning .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.success .notification-message-container{background-color:var(--success-light);border-color:var(--base-100)}.notification-message.success .notification-message-container .message-icon{color:var(--success-dark)}.notification-message.success .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message .notification-message-container{border:1px solid var(--base-95);border-radius:.5em}.notification-message .notification-message-container.mobile{padding:.6em .4em!important}.notification-message .notification-message-container.mobile .items-container{margin-left:.4em!important}.notification-message .notification-message-container.mobile .items-container div+div{margin-top:.2em!important}.notification-message .notification-message-container.mobile .items-container .message-title+.message-body{margin-top:0!important}.notification-message .notification-message-container .text-container:first-child{line-height:1.5em}.notification-message .notification-message-container .text-container .message-title{font-weight:500;margin:0}.notification-message .notification-message-container .text-container .message-body{margin:0}.notification-message .notification-message-container:not(.inline){padding:1.5em}.notification-message .notification-message-container:not(.inline) .items-container{margin-left:1em}.notification-message .notification-message-container:not(.inline) .items-container div+div,.notification-message .notification-message-container:not(.inline) .items-container .message-title+.message-body{margin-top:1em}.notification-message .notification-message-container:not(.inline) .message-title{font-size:1.25em}.notification-message .notification-message-container:not(.inline) .message-body{line-height:1.5em}.notification-message .notification-message-container.inline{padding:.75em 1em}.notification-message .notification-message-container.inline .items-container{margin-left:.75em}.notification-message .notification-message-container.inline .items-container div+div{margin-top:.5em}.notification-message .notification-message-container.inline .items-container .message-title+.message-body{margin-top:.2em}.notification-message .notification-message-container.inline .message-title{font-size:1em}\n"] }]
|
|
508
590
|
}], propDecorators: { message: [{
|
|
509
591
|
type: Input
|
|
510
592
|
}], buttonClicked: [{
|
|
@@ -768,10 +850,10 @@ class FileUploadComponent {
|
|
|
768
850
|
}
|
|
769
851
|
}
|
|
770
852
|
FileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
771
|
-
FileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: FileUploadComponent, selector: "tld-file-upload", inputs: { accept: "accept", maxSize: "maxSize", multiple: "multiple", filePreviewProgress: "filePreviewProgress", allowEmpty: "allowEmpty", disabled: "disabled", extendedAcceptList: "extendedAcceptList" }, outputs: { fileChange: "fileChange", errorEvent: "errorEvent" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }, { propertyName: "inputButton", first: true, predicate: ["inputButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"file-upload\" [ngClass.lt-sm]=\"'file-upload-mobile'\">\r\n <mat-progress-bar class=\"tld-file-upload-progress\" color=\"primary\" [value]=\"filePreviewProgress\"\r\n *ngIf=\"filePreviewProgress\"></mat-progress-bar>\r\n <button tldDragAndDrop #inputButton mat-button (fileDropped)=\"onFileDrop($event)\" [disabled]=\"disabled\" type=\"button\"\r\n (click)=\"fileInput.click()\" class=\"upload-button\">\r\n <ng-content></ng-content>\r\n </button>\r\n</div>\r\n<input #fileInput type=\"file\" (change)=\"handleFileInput($event)\" name=\"files\" class=\"native-file-input\"\r\n [accept]=\"allowedExtensions\" [multiple]=\"multiple\" />\r\n", styles: [".file-upload{max-width:100%;width:100%}.file-upload .upload-button{width:100%;font-size:1em;border:1px dashed #9aa5b1;border-radius:16px;background-color:#fff;font-family:var(--tld-font);padding:1em;white-space:normal;line-height:normal;text-align:left}.file-upload-mobile .upload-button{border:2px dashed grey;padding:.5em 1em!important}.tld-file-over{background-color:#e5e7e8!important;border-color:#00f!important}.mat-stroked-button .mat-button-wrapper{pointer-events:none}.native-file-input{display:none}.tld-file-upload-progress ::ng-deep .mat-progress-bar-fill:after{background-color:#1e457c}.tld-file-upload-progress ::ng-deep .mat-progress-bar-buffer{background:white}\n"], components: [{ type: i1$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: i2$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i4.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
853
|
+
FileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: FileUploadComponent, selector: "tld-file-upload", inputs: { accept: "accept", maxSize: "maxSize", multiple: "multiple", filePreviewProgress: "filePreviewProgress", allowEmpty: "allowEmpty", disabled: "disabled", extendedAcceptList: "extendedAcceptList" }, outputs: { fileChange: "fileChange", errorEvent: "errorEvent" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }, { propertyName: "inputButton", first: true, predicate: ["inputButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"file-upload\" [ngClass.lt-sm]=\"'file-upload-mobile'\">\r\n <mat-progress-bar class=\"tld-file-upload-progress\" color=\"primary\" [value]=\"filePreviewProgress\"\r\n *ngIf=\"filePreviewProgress\"></mat-progress-bar>\r\n <button tldDragAndDrop #inputButton mat-button (fileDropped)=\"onFileDrop($event)\" [disabled]=\"disabled\" type=\"button\"\r\n (click)=\"fileInput.click()\" class=\"upload-button text-l\">\r\n <ng-content></ng-content>\r\n </button>\r\n</div>\r\n<input #fileInput type=\"file\" (change)=\"handleFileInput($event)\" name=\"files\" class=\"native-file-input\"\r\n [accept]=\"allowedExtensions\" [multiple]=\"multiple\" />\r\n", styles: [".file-upload{max-width:100%;width:100%}.file-upload .upload-button{width:100%;font-size:1em;border:1px dashed #9aa5b1;border-radius:16px;background-color:#fff;font-family:var(--tld-font);padding:1em;white-space:normal;line-height:normal;text-align:left}.file-upload-mobile .upload-button{border:2px dashed grey;padding:.5em 1em!important}.tld-file-over{background-color:#e5e7e8!important;border-color:#00f!important}.mat-stroked-button .mat-button-wrapper{pointer-events:none}.native-file-input{display:none}.tld-file-upload-progress ::ng-deep .mat-progress-bar-fill:after{background-color:#1e457c}.tld-file-upload-progress ::ng-deep .mat-progress-bar-buffer{background:white}\n"], components: [{ type: i1$2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: i2$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i4.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: DragAndDropDirective, selector: "[tldDragAndDrop]", outputs: ["fileDropped"] }] });
|
|
772
854
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FileUploadComponent, decorators: [{
|
|
773
855
|
type: Component,
|
|
774
|
-
args: [{ selector: 'tld-file-upload', template: "<div class=\"file-upload\" [ngClass.lt-sm]=\"'file-upload-mobile'\">\r\n <mat-progress-bar class=\"tld-file-upload-progress\" color=\"primary\" [value]=\"filePreviewProgress\"\r\n *ngIf=\"filePreviewProgress\"></mat-progress-bar>\r\n <button tldDragAndDrop #inputButton mat-button (fileDropped)=\"onFileDrop($event)\" [disabled]=\"disabled\" type=\"button\"\r\n (click)=\"fileInput.click()\" class=\"upload-button\">\r\n <ng-content></ng-content>\r\n </button>\r\n</div>\r\n<input #fileInput type=\"file\" (change)=\"handleFileInput($event)\" name=\"files\" class=\"native-file-input\"\r\n [accept]=\"allowedExtensions\" [multiple]=\"multiple\" />\r\n", styles: [".file-upload{max-width:100%;width:100%}.file-upload .upload-button{width:100%;font-size:1em;border:1px dashed #9aa5b1;border-radius:16px;background-color:#fff;font-family:var(--tld-font);padding:1em;white-space:normal;line-height:normal;text-align:left}.file-upload-mobile .upload-button{border:2px dashed grey;padding:.5em 1em!important}.tld-file-over{background-color:#e5e7e8!important;border-color:#00f!important}.mat-stroked-button .mat-button-wrapper{pointer-events:none}.native-file-input{display:none}.tld-file-upload-progress ::ng-deep .mat-progress-bar-fill:after{background-color:#1e457c}.tld-file-upload-progress ::ng-deep .mat-progress-bar-buffer{background:white}\n"] }]
|
|
856
|
+
args: [{ selector: 'tld-file-upload', template: "<div class=\"file-upload\" [ngClass.lt-sm]=\"'file-upload-mobile'\">\r\n <mat-progress-bar class=\"tld-file-upload-progress\" color=\"primary\" [value]=\"filePreviewProgress\"\r\n *ngIf=\"filePreviewProgress\"></mat-progress-bar>\r\n <button tldDragAndDrop #inputButton mat-button (fileDropped)=\"onFileDrop($event)\" [disabled]=\"disabled\" type=\"button\"\r\n (click)=\"fileInput.click()\" class=\"upload-button text-l\">\r\n <ng-content></ng-content>\r\n </button>\r\n</div>\r\n<input #fileInput type=\"file\" (change)=\"handleFileInput($event)\" name=\"files\" class=\"native-file-input\"\r\n [accept]=\"allowedExtensions\" [multiple]=\"multiple\" />\r\n", styles: [".file-upload{max-width:100%;width:100%}.file-upload .upload-button{width:100%;font-size:1em;border:1px dashed #9aa5b1;border-radius:16px;background-color:#fff;font-family:var(--tld-font);padding:1em;white-space:normal;line-height:normal;text-align:left}.file-upload-mobile .upload-button{border:2px dashed grey;padding:.5em 1em!important}.tld-file-over{background-color:#e5e7e8!important;border-color:#00f!important}.mat-stroked-button .mat-button-wrapper{pointer-events:none}.native-file-input{display:none}.tld-file-upload-progress ::ng-deep .mat-progress-bar-fill:after{background-color:#1e457c}.tld-file-upload-progress ::ng-deep .mat-progress-bar-buffer{background:white}\n"] }]
|
|
775
857
|
}], propDecorators: { fileInput: [{
|
|
776
858
|
type: ViewChild,
|
|
777
859
|
args: ['fileInput']
|
|
@@ -804,12 +886,14 @@ FileUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version
|
|
|
804
886
|
FileUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FileUploadModule, declarations: [FileUploadComponent], imports: [CommonModule,
|
|
805
887
|
MatProgressBarModule,
|
|
806
888
|
FlexLayoutModule,
|
|
807
|
-
MatButtonModule
|
|
889
|
+
MatButtonModule,
|
|
890
|
+
DragAndDropModule], exports: [FileUploadComponent] });
|
|
808
891
|
FileUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FileUploadModule, imports: [[
|
|
809
892
|
CommonModule,
|
|
810
893
|
MatProgressBarModule,
|
|
811
894
|
FlexLayoutModule,
|
|
812
|
-
MatButtonModule
|
|
895
|
+
MatButtonModule,
|
|
896
|
+
DragAndDropModule
|
|
813
897
|
]] });
|
|
814
898
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FileUploadModule, decorators: [{
|
|
815
899
|
type: NgModule,
|
|
@@ -819,7 +903,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImpor
|
|
|
819
903
|
CommonModule,
|
|
820
904
|
MatProgressBarModule,
|
|
821
905
|
FlexLayoutModule,
|
|
822
|
-
MatButtonModule
|
|
906
|
+
MatButtonModule,
|
|
907
|
+
DragAndDropModule
|
|
823
908
|
],
|
|
824
909
|
exports: [
|
|
825
910
|
FileUploadComponent
|
|
@@ -852,6 +937,14 @@ class FilterBarComponent {
|
|
|
852
937
|
var _a, _b;
|
|
853
938
|
return (_b = (_a = this.settings) === null || _a === void 0 ? void 0 : _a.filters) !== null && _b !== void 0 ? _b : [];
|
|
854
939
|
}
|
|
940
|
+
ngOnInit() {
|
|
941
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
942
|
+
this.searchTooltip = (_b = (_a = this.settings) === null || _a === void 0 ? void 0 : _a.searchTooltip) !== null && _b !== void 0 ? _b : 'FILTER_BAR.SEARCH_TOOLTIP';
|
|
943
|
+
this.searchTitle = (_d = (_c = this.settings) === null || _c === void 0 ? void 0 : _c.searchTitle) !== null && _d !== void 0 ? _d : 'FILTER_BAR.SEARCH';
|
|
944
|
+
this.prefixIcon = (_f = (_e = this.settings) === null || _e === void 0 ? void 0 : _e.prefixIcon) !== null && _f !== void 0 ? _f : "filter_alt";
|
|
945
|
+
this.suffixIcon = (_h = (_g = this.settings) === null || _g === void 0 ? void 0 : _g.suffixIcon) !== null && _h !== void 0 ? _h : "question_mark";
|
|
946
|
+
this.showSuffixIcon = (_k = (_j = this.settings) === null || _j === void 0 ? void 0 : _j.showSuffixIcon) !== null && _k !== void 0 ? _k : true;
|
|
947
|
+
}
|
|
855
948
|
filterChange(filter, event) {
|
|
856
949
|
this.filters.filters[filter.fieldName] = event.value.map(item => item.value);
|
|
857
950
|
this.emitFilters();
|
|
@@ -861,10 +954,10 @@ class FilterBarComponent {
|
|
|
861
954
|
}
|
|
862
955
|
}
|
|
863
956
|
FilterBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FilterBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
864
|
-
FilterBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: FilterBarComponent, selector: "tld-filter-bar", inputs: { settings: "settings" }, outputs: { filterBarChange: "filterBarChange" }, ngImport: i0, template: "<div fxLayout=\"row\">\r\n <mat-form-field fxFlex *ngIf=\"showSearch\" class=\"filter-bar-search-input\">\r\n <span matPrefix class=\"material-icons-outlined\">\r\n
|
|
957
|
+
FilterBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: FilterBarComponent, selector: "tld-filter-bar", inputs: { settings: "settings" }, outputs: { filterBarChange: "filterBarChange" }, ngImport: i0, template: "<div fxLayout=\"row\">\r\n <mat-form-field fxFlex *ngIf=\"showSearch\" class=\"filter-bar-search-input\">\r\n <span matPrefix class=\"material-icons-outlined\">\r\n {{prefixIcon}}\r\n </span>\r\n <span matSuffix class=\"material-icons-outlined\" *ngIf=\"showSuffixIcon\" [matTooltip]=\"searchTooltip | translate\">\r\n {{suffixIcon}}\r\n </span>\r\n <input class=\"search-input\" matInput [(ngModel)]=\"inputText\" [placeholder]=\"searchTitle | translate\">\r\n </mat-form-field>\r\n <mat-form-field *ngFor=\"let filter of fields\">\r\n <mat-label>{{filter.title | translate}}</mat-label>\r\n <mat-select multiple (selectionChange)=\"filterChange(filter, $event)\">\r\n <mat-option *ngFor=\"let value of filter.values\" [value]=\"value\">\r\n {{value.key | translate : {default: value.value | titlecase } }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n</div>\r\n", styles: [":host{display:inline-block;background-color:var(--base-95);min-height:40px;min-width:100%;border-radius:.5rem;padding:.5rem 1.25rem}.search-input{background-color:unset;border:none}mat-form-field+mat-form-field{margin-left:1rem}.filter-bar-search-input{width:100%}.filter-bar-search-input::ng-deep .material-icons-outlined{vertical-align:bottom}.material-icons-outlined{color:var(--base-40)}\n"], components: [{ type: i1$3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i2$3.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i3$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i1$3.MatPrefix, selector: "[matPrefix]" }, { type: i1$3.MatSuffix, selector: "[matSuffix]" }, { type: i2$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i8.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$3.MatLabel, selector: "mat-label" }], pipes: { "translate": i1$1.TranslatePipe, "titlecase": i5.TitleCasePipe } });
|
|
865
958
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FilterBarComponent, decorators: [{
|
|
866
959
|
type: Component,
|
|
867
|
-
args: [{ selector: 'tld-filter-bar', template: "<div fxLayout=\"row\">\r\n <mat-form-field fxFlex *ngIf=\"showSearch\" class=\"filter-bar-search-input\">\r\n <span matPrefix class=\"material-icons-outlined\">\r\n
|
|
960
|
+
args: [{ selector: 'tld-filter-bar', template: "<div fxLayout=\"row\">\r\n <mat-form-field fxFlex *ngIf=\"showSearch\" class=\"filter-bar-search-input\">\r\n <span matPrefix class=\"material-icons-outlined\">\r\n {{prefixIcon}}\r\n </span>\r\n <span matSuffix class=\"material-icons-outlined\" *ngIf=\"showSuffixIcon\" [matTooltip]=\"searchTooltip | translate\">\r\n {{suffixIcon}}\r\n </span>\r\n <input class=\"search-input\" matInput [(ngModel)]=\"inputText\" [placeholder]=\"searchTitle | translate\">\r\n </mat-form-field>\r\n <mat-form-field *ngFor=\"let filter of fields\">\r\n <mat-label>{{filter.title | translate}}</mat-label>\r\n <mat-select multiple (selectionChange)=\"filterChange(filter, $event)\">\r\n <mat-option *ngFor=\"let value of filter.values\" [value]=\"value\">\r\n {{value.key | translate : {default: value.value | titlecase } }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n</div>\r\n", styles: [":host{display:inline-block;background-color:var(--base-95);min-height:40px;min-width:100%;border-radius:.5rem;padding:.5rem 1.25rem}.search-input{background-color:unset;border:none}mat-form-field+mat-form-field{margin-left:1rem}.filter-bar-search-input{width:100%}.filter-bar-search-input::ng-deep .material-icons-outlined{vertical-align:bottom}.material-icons-outlined{color:var(--base-40)}\n"] }]
|
|
868
961
|
}], propDecorators: { filterBarChange: [{
|
|
869
962
|
type: Output
|
|
870
963
|
}], settings: [{
|
|
@@ -880,7 +973,8 @@ FilterBarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version
|
|
|
880
973
|
MatFormFieldModule,
|
|
881
974
|
FlexLayoutModule,
|
|
882
975
|
MatSelectModule,
|
|
883
|
-
FormsModule
|
|
976
|
+
FormsModule,
|
|
977
|
+
MatTooltipModule], exports: [FilterBarComponent] });
|
|
884
978
|
FilterBarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FilterBarModule, imports: [[
|
|
885
979
|
CommonModule,
|
|
886
980
|
TranslateModule,
|
|
@@ -888,7 +982,8 @@ FilterBarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version
|
|
|
888
982
|
MatFormFieldModule,
|
|
889
983
|
FlexLayoutModule,
|
|
890
984
|
MatSelectModule,
|
|
891
|
-
FormsModule
|
|
985
|
+
FormsModule,
|
|
986
|
+
MatTooltipModule
|
|
892
987
|
]] });
|
|
893
988
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FilterBarModule, decorators: [{
|
|
894
989
|
type: NgModule,
|
|
@@ -903,7 +998,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImpor
|
|
|
903
998
|
MatFormFieldModule,
|
|
904
999
|
FlexLayoutModule,
|
|
905
1000
|
MatSelectModule,
|
|
906
|
-
FormsModule
|
|
1001
|
+
FormsModule,
|
|
1002
|
+
MatTooltipModule
|
|
907
1003
|
],
|
|
908
1004
|
exports: [
|
|
909
1005
|
FilterBarComponent
|
|
@@ -919,5 +1015,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImpor
|
|
|
919
1015
|
* Generated bundle index. Do not edit.
|
|
920
1016
|
*/
|
|
921
1017
|
|
|
922
|
-
export { ClickOutsideDirective, ClickOutsideModule, CloseButtonComponent, CloseButtonModule, CompanyProductComponent, CompanyProductModule, DOMService, FileUploadComponent, FileUploadErrorTypeEnum, FileUploadModule, FilterBarComponent, FilterBarModule, FilterWithHighlightModule, FilterWithHighlightPipe, FooterComponent, FooterModule, IconService, InlineMessageComponent, InlineMessageIconPosition, InlineMessageModule, InlineMessageType, MissingTranslationHelper, NotificationMessageComponent, NotificationMessageModule, NotificationMessageType, PlausibleEventDirective, PlausibleHelper, PlausibleModule, SortTranslationsModule, SortTranslationsPipe, TldLoaderComponent, TldLoaderModule };
|
|
1018
|
+
export { ClickOutsideDirective, ClickOutsideModule, CloseButtonComponent, CloseButtonModule, CompanyProductComponent, CompanyProductModule, DOMService, DragAndDropDirective, DragAndDropModule, FileUploadComponent, FileUploadErrorTypeEnum, FileUploadModule, FilterBarComponent, FilterBarModule, FilterWithHighlightModule, FilterWithHighlightPipe, FooterComponent, FooterModule, IconService, InlineMessageComponent, InlineMessageIconPosition, InlineMessageModule, InlineMessageType, MissingTranslationHelper, NotificationMessageComponent, NotificationMessageModule, NotificationMessageType, PlausibleEventDirective, PlausibleHelper, PlausibleModule, SortTranslationsModule, SortTranslationsPipe, TldLoaderComponent, TldLoaderModule };
|
|
923
1019
|
//# sourceMappingURL=tilde-nlp-ngx-common.mjs.map
|