@wolkabout/commons 0.1.2 → 0.1.4
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.
|
@@ -2987,8 +2987,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
2987
2987
|
}] } });
|
|
2988
2988
|
|
|
2989
2989
|
const formatDuration = (totalSeconds) => {
|
|
2990
|
-
if (
|
|
2990
|
+
if (totalSeconds === null || totalSeconds === undefined) {
|
|
2991
2991
|
return '-';
|
|
2992
|
+
}
|
|
2992
2993
|
const days = Math.floor(totalSeconds / (24 * 60 * 60));
|
|
2993
2994
|
const hours = Math.floor((totalSeconds % (24 * 60 * 60)) / (60 * 60));
|
|
2994
2995
|
const minutes = Math.floor((totalSeconds % (60 * 60)) / 60);
|
|
@@ -4228,11 +4229,11 @@ class AutocompleteComponent {
|
|
|
4228
4229
|
document.removeEventListener('touchmove', this.scrollEvent, true);
|
|
4229
4230
|
}
|
|
4230
4231
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AutocompleteComponent, deps: [{ token: i5.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
4231
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: AutocompleteComponent, isStandalone: true, selector: "app-autocomplete", inputs: { name: "name", dataFunction: "dataFunction", displayFunction: "displayFunction", outlineBackground: "outlineBackground", hideRequiredMarker: "hideRequiredMarker" }, queries: [{ propertyName: "dropdownTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }], ngImport: i0, template: "<ng-container>\
|
|
4232
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: AutocompleteComponent, isStandalone: true, selector: "app-autocomplete", inputs: { name: "name", dataFunction: "dataFunction", displayFunction: "displayFunction", outlineBackground: "outlineBackground", hideRequiredMarker: "hideRequiredMarker" }, queries: [{ propertyName: "dropdownTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }], ngImport: i0, template: "<ng-container>\n <div class=\"w-full\">\n <mat-form-field [ngClass]=\"{ 'outline-background': outlineBackground }\" class=\"w-full\" [hideRequiredMarker]=\"hideRequiredMarker\">\n <mat-label>\n <span>{{ name | translate }}</span>\n </mat-label>\n <input matInput #autoCompleteInput [ngClass]=\"{'cursor-text' : !hasValue(), 'cursor-default' : hasValue()}\" [formControl]=\"formControl\" [readonly]=\"hasValue()\" [placeholder]=\"name | translate\" autocomplete=\"off\"\n [matAutocomplete]=\"auto\" (blur)=\"onTouched($event)\" [attr.data-test]=\"name + 'SearchInput'\"/>\n @if (!disabled) {\n <button matSuffix mat-icon-button *ngIf=\"formControl.value\" (click)=\"clear()\" type='button'>\n <mat-icon class=\"text-mat-sys-on-error-container\">clear</mat-icon>\n </button>\n }\n @for (error of getErrors(); track error) {\n <mat-error>{{ 'COMMON.ERROR_VALIDATION_' + error | translate }}</mat-error>\n }\n </mat-form-field>\n </div>\n <mat-autocomplete #auto=\"matAutocomplete\" [class]=\"'autocomplete-panel'\" [displayWith]=\"displayFunction\">\n @if (loading$ | async) {\n <mat-option>\n <div>{{ 'Loading...' }}</div>\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n </mat-option>\n } @else {\n <mat-option *ngFor=\"let item of data$ | async; let i = index\" [value]=\"item\" class=\"autocomplete-option\" [attr.data-test]=\"name + 'SearchItem' + (i + 1)\">\n <ng-container [ngTemplateOutlet]=\"dropdownTemplate ? dropdownTemplate : defaultTemplate\" [ngTemplateOutletContext]=\"{ item }\"></ng-container>\n <ng-template #defaultTemplate>{{ displayFunction(item) }}</ng-template>\n </mat-option>\n }\n </mat-autocomplete>\n</ng-container>\n", styles: [".mat-option-hidden{display:none}.autocomplete-option{height:fit-content}.autocomplete-option.autocomplete-option__active,.autocomplete-option.autocomplete-option__active:hover{background-color:var(--color-primary-50)}.autocomplete-info{height:30px;font-size:14px}.autocomplete-info.secondary{font-size:12px;height:25px}.autocomplete-info .autocomplete-item{text-overflow:ellipsis;overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i7.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: i8.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i8.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i9.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }] });
|
|
4232
4233
|
}
|
|
4233
4234
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AutocompleteComponent, decorators: [{
|
|
4234
4235
|
type: Component,
|
|
4235
|
-
args: [{ selector: 'app-autocomplete', imports: [SharedModule], template: "<ng-container>\
|
|
4236
|
+
args: [{ selector: 'app-autocomplete', imports: [SharedModule], template: "<ng-container>\n <div class=\"w-full\">\n <mat-form-field [ngClass]=\"{ 'outline-background': outlineBackground }\" class=\"w-full\" [hideRequiredMarker]=\"hideRequiredMarker\">\n <mat-label>\n <span>{{ name | translate }}</span>\n </mat-label>\n <input matInput #autoCompleteInput [ngClass]=\"{'cursor-text' : !hasValue(), 'cursor-default' : hasValue()}\" [formControl]=\"formControl\" [readonly]=\"hasValue()\" [placeholder]=\"name | translate\" autocomplete=\"off\"\n [matAutocomplete]=\"auto\" (blur)=\"onTouched($event)\" [attr.data-test]=\"name + 'SearchInput'\"/>\n @if (!disabled) {\n <button matSuffix mat-icon-button *ngIf=\"formControl.value\" (click)=\"clear()\" type='button'>\n <mat-icon class=\"text-mat-sys-on-error-container\">clear</mat-icon>\n </button>\n }\n @for (error of getErrors(); track error) {\n <mat-error>{{ 'COMMON.ERROR_VALIDATION_' + error | translate }}</mat-error>\n }\n </mat-form-field>\n </div>\n <mat-autocomplete #auto=\"matAutocomplete\" [class]=\"'autocomplete-panel'\" [displayWith]=\"displayFunction\">\n @if (loading$ | async) {\n <mat-option>\n <div>{{ 'Loading...' }}</div>\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n </mat-option>\n } @else {\n <mat-option *ngFor=\"let item of data$ | async; let i = index\" [value]=\"item\" class=\"autocomplete-option\" [attr.data-test]=\"name + 'SearchItem' + (i + 1)\">\n <ng-container [ngTemplateOutlet]=\"dropdownTemplate ? dropdownTemplate : defaultTemplate\" [ngTemplateOutletContext]=\"{ item }\"></ng-container>\n <ng-template #defaultTemplate>{{ displayFunction(item) }}</ng-template>\n </mat-option>\n }\n </mat-autocomplete>\n</ng-container>\n", styles: [".mat-option-hidden{display:none}.autocomplete-option{height:fit-content}.autocomplete-option.autocomplete-option__active,.autocomplete-option.autocomplete-option__active:hover{background-color:var(--color-primary-50)}.autocomplete-info{height:30px;font-size:14px}.autocomplete-info.secondary{font-size:12px;height:25px}.autocomplete-info .autocomplete-item{text-overflow:ellipsis;overflow:hidden}\n"] }]
|
|
4236
4237
|
}], ctorParameters: () => [{ type: i5.NgControl, decorators: [{
|
|
4237
4238
|
type: Optional
|
|
4238
4239
|
}, {
|
|
@@ -4344,11 +4345,11 @@ class AutocompleteChipsComponent {
|
|
|
4344
4345
|
document.removeEventListener('touchmove', this.scrollEvent, true);
|
|
4345
4346
|
}
|
|
4346
4347
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AutocompleteChipsComponent, deps: [{ token: i5.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
4347
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: AutocompleteChipsComponent, isStandalone: true, selector: "app-autocomplete-chips", inputs: { name: "name", dataFunction: "dataFunction", displayFunction: "displayFunction", outlineBackground: "outlineBackground" }, queries: [{ propertyName: "dropdownTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }, { propertyName: "inputRef", first: true, predicate: ["autoCompleteInput"], descendants: true }], ngImport: i0, template: "<div class=\"w-full\" [ngClass]=\"{'required' : !!getErrors().length && !formControl.untouched && !(items$ | async)?.length}\">\
|
|
4348
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: AutocompleteChipsComponent, isStandalone: true, selector: "app-autocomplete-chips", inputs: { name: "name", dataFunction: "dataFunction", displayFunction: "displayFunction", outlineBackground: "outlineBackground" }, queries: [{ propertyName: "dropdownTemplate", first: true, predicate: TemplateRef, descendants: true }], viewQueries: [{ propertyName: "autocompleteTrigger", first: true, predicate: MatAutocompleteTrigger, descendants: true }, { propertyName: "inputRef", first: true, predicate: ["autoCompleteInput"], descendants: true }], ngImport: i0, template: "<div class=\"w-full\" [ngClass]=\"{'required' : !!getErrors().length && !formControl.untouched && !(items$ | async)?.length}\">\n <mat-form-field [ngClass]=\"{ 'outline-background': outlineBackground }\" class=\"w-full\">\n <mat-label>\n <span>{{ name | translate }}</span>\n </mat-label>\n <mat-chip-grid #chipGrid>\n <mat-chip-row *ngFor=\"let item of items$ | async as items; let i = index\"\n [removable]=\"!disabled\"\n (removed)=\"removeItem(i, items)\">\n {{ displayFunction(item) }}\n <mat-icon class=\"text-mat-sys-on-error-container\" matChipRemove *ngIf=\"!disabled\">cancel</mat-icon>\n </mat-chip-row>\n <input matInput\n #autoCompleteInput\n [placeholder]=\"name | translate\"\n autocomplete=\"off\"\n [formControl]=\"formControl\"\n [matAutocomplete]=\"auto\"\n [matChipInputFor]=\"chipGrid\"\n (blur)=\"onTouched($event)\"/>\n </mat-chip-grid>\n </mat-form-field>\n\n @for (error of getErrors(); track error) {\n @if (!formControl.untouched && !(items$ | async)?.length) {\n <mat-error class=\"ml-4 mt-[-2px] text-xs\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate }}</mat-error>\n }\n }\n</div>\n<mat-autocomplete #auto=\"matAutocomplete\" [class]=\"'autocomplete-panel'\" (optionSelected)=\"addItem($event)\">\n @if (loading$ | async) {\n <mat-option>\n <div>{{ 'Loading...' }}</div>\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n </mat-option>\n } @else {\n <ng-container *ngFor=\"let item of data$ | async; let i = index\">\n @if (shouldShowOption(item, (items$ | async) ?? [])) {\n <mat-option\n [value]=\"item\"\n class=\"autocomplete-option\"\n [attr.data-test]=\"name + 'SearchItem' + (i + 1)\">\n <ng-container [ngTemplateOutlet]=\"dropdownTemplate ? dropdownTemplate : defaultTemplate\"\n [ngTemplateOutletContext]=\"{ item }\"></ng-container>\n <ng-template #defaultTemplate>{{ displayFunction(item) }}</ng-template>\n </mat-option>\n }\n </ng-container>\n }\n</mat-autocomplete>\n", styles: [".mat-option-hidden{display:none}.autocomplete-option{height:fit-content}.autocomplete-option.autocomplete-option__active,.autocomplete-option.autocomplete-option__active:hover{background-color:var(--color-primary-50)}.autocomplete-info{height:30px;font-size:14px}.autocomplete-info.secondary{font-size:12px;height:25px}.autocomplete-info .autocomplete-item{text-overflow:ellipsis;overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i7.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: i8.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "directive", type: i8.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "component", type: i8$1.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i8$1.MatChipInput, selector: "input[matChipInputFor]", inputs: ["matChipInputFor", "matChipInputAddOnBlur", "matChipInputSeparatorKeyCodes", "placeholder", "id", "disabled", "readonly", "matChipInputDisabledInteractive"], outputs: ["matChipInputTokenEnd"], exportAs: ["matChipInput", "matChipInputFor"] }, { kind: "directive", type: i8$1.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i8$1.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i9.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }] });
|
|
4348
4349
|
}
|
|
4349
4350
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AutocompleteChipsComponent, decorators: [{
|
|
4350
4351
|
type: Component,
|
|
4351
|
-
args: [{ selector: 'app-autocomplete-chips', imports: [SharedModule], template: "<div class=\"w-full\" [ngClass]=\"{'required' : !!getErrors().length && !formControl.untouched && !(items$ | async)?.length}\">\
|
|
4352
|
+
args: [{ selector: 'app-autocomplete-chips', imports: [SharedModule], template: "<div class=\"w-full\" [ngClass]=\"{'required' : !!getErrors().length && !formControl.untouched && !(items$ | async)?.length}\">\n <mat-form-field [ngClass]=\"{ 'outline-background': outlineBackground }\" class=\"w-full\">\n <mat-label>\n <span>{{ name | translate }}</span>\n </mat-label>\n <mat-chip-grid #chipGrid>\n <mat-chip-row *ngFor=\"let item of items$ | async as items; let i = index\"\n [removable]=\"!disabled\"\n (removed)=\"removeItem(i, items)\">\n {{ displayFunction(item) }}\n <mat-icon class=\"text-mat-sys-on-error-container\" matChipRemove *ngIf=\"!disabled\">cancel</mat-icon>\n </mat-chip-row>\n <input matInput\n #autoCompleteInput\n [placeholder]=\"name | translate\"\n autocomplete=\"off\"\n [formControl]=\"formControl\"\n [matAutocomplete]=\"auto\"\n [matChipInputFor]=\"chipGrid\"\n (blur)=\"onTouched($event)\"/>\n </mat-chip-grid>\n </mat-form-field>\n\n @for (error of getErrors(); track error) {\n @if (!formControl.untouched && !(items$ | async)?.length) {\n <mat-error class=\"ml-4 mt-[-2px] text-xs\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate }}</mat-error>\n }\n }\n</div>\n<mat-autocomplete #auto=\"matAutocomplete\" [class]=\"'autocomplete-panel'\" (optionSelected)=\"addItem($event)\">\n @if (loading$ | async) {\n <mat-option>\n <div>{{ 'Loading...' }}</div>\n <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n </mat-option>\n } @else {\n <ng-container *ngFor=\"let item of data$ | async; let i = index\">\n @if (shouldShowOption(item, (items$ | async) ?? [])) {\n <mat-option\n [value]=\"item\"\n class=\"autocomplete-option\"\n [attr.data-test]=\"name + 'SearchItem' + (i + 1)\">\n <ng-container [ngTemplateOutlet]=\"dropdownTemplate ? dropdownTemplate : defaultTemplate\"\n [ngTemplateOutletContext]=\"{ item }\"></ng-container>\n <ng-template #defaultTemplate>{{ displayFunction(item) }}</ng-template>\n </mat-option>\n }\n </ng-container>\n }\n</mat-autocomplete>\n", styles: [".mat-option-hidden{display:none}.autocomplete-option{height:fit-content}.autocomplete-option.autocomplete-option__active,.autocomplete-option.autocomplete-option__active:hover{background-color:var(--color-primary-50)}.autocomplete-info{height:30px;font-size:14px}.autocomplete-info.secondary{font-size:12px;height:25px}.autocomplete-info .autocomplete-item{text-overflow:ellipsis;overflow:hidden}\n"] }]
|
|
4352
4353
|
}], ctorParameters: () => [{ type: i5.NgControl, decorators: [{
|
|
4353
4354
|
type: Optional
|
|
4354
4355
|
}, {
|
|
@@ -4402,14 +4403,14 @@ class BasicTimeSeriesGraphComponent {
|
|
|
4402
4403
|
trigger: 'axis',
|
|
4403
4404
|
formatter: (params) => {
|
|
4404
4405
|
const [timestamp, data] = params[0].data;
|
|
4405
|
-
return `
|
|
4406
|
-
<div class="flex flex-col gap-y-2">
|
|
4407
|
-
<div>${this.timeFormatter.transform(timestamp)}</div>
|
|
4408
|
-
<div class="flex flex-row gap-x-2 items-center">
|
|
4409
|
-
<div class="h-2 w-2 bg-mat-sys-primary rounded-3xl"> </div>
|
|
4410
|
-
<div>${timeSeries.name}:</div>
|
|
4411
|
-
<div><span class="font-bold">${data}</span><span>${timeSeries.unitSymbol ?? ''}</span></div>
|
|
4412
|
-
</div>
|
|
4406
|
+
return `
|
|
4407
|
+
<div class="flex flex-col gap-y-2">
|
|
4408
|
+
<div>${this.timeFormatter.transform(timestamp)}</div>
|
|
4409
|
+
<div class="flex flex-row gap-x-2 items-center">
|
|
4410
|
+
<div class="h-2 w-2 bg-mat-sys-primary rounded-3xl"> </div>
|
|
4411
|
+
<div>${timeSeries.name}:</div>
|
|
4412
|
+
<div><span class="font-bold">${data}</span><span>${timeSeries.unitSymbol ?? ''}</span></div>
|
|
4413
|
+
</div>
|
|
4413
4414
|
</div>`;
|
|
4414
4415
|
},
|
|
4415
4416
|
axisPointer: {
|
|
@@ -4445,11 +4446,11 @@ class BasicTimeSeriesGraphComponent {
|
|
|
4445
4446
|
});
|
|
4446
4447
|
}
|
|
4447
4448
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: BasicTimeSeriesGraphComponent, deps: [{ token: SimpleDateTimePipe }], target: i0.ɵɵFactoryTarget.Component });
|
|
4448
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: BasicTimeSeriesGraphComponent, isStandalone: true, selector: "app-basic-time-series-graph", inputs: { timeSeries: { classPropertyName: "timeSeries", publicName: "timeSeries", isSignal: true, isRequired: true, transformFunction: null }, desiredTimeFrame: { classPropertyName: "desiredTimeFrame", publicName: "desiredTimeFrame", isSignal: true, isRequired: false, transformFunction: null }, primaryColor: { classPropertyName: "primaryColor", publicName: "primaryColor", isSignal: true, isRequired: false, transformFunction: null } }, providers: [SimpleDatePipe, SimpleDateTimePipe], ngImport: i0, template: "<div echarts [options]=\"graphOptions()\" (chartDataZoom)=\"chartZoom($event)\" [theme]=\"chartTheme()!\" class=\"w-full h-full\"></div>\
|
|
4449
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: BasicTimeSeriesGraphComponent, isStandalone: true, selector: "app-basic-time-series-graph", inputs: { timeSeries: { classPropertyName: "timeSeries", publicName: "timeSeries", isSignal: true, isRequired: true, transformFunction: null }, desiredTimeFrame: { classPropertyName: "desiredTimeFrame", publicName: "desiredTimeFrame", isSignal: true, isRequired: false, transformFunction: null }, primaryColor: { classPropertyName: "primaryColor", publicName: "primaryColor", isSignal: true, isRequired: false, transformFunction: null } }, providers: [SimpleDatePipe, SimpleDateTimePipe], ngImport: i0, template: "<div echarts [options]=\"graphOptions()\" (chartDataZoom)=\"chartZoom($event)\" [theme]=\"chartTheme()!\" class=\"w-full h-full\"></div>\n", styles: [""], dependencies: [{ kind: "directive", type: NgxEchartsDirective, selector: "echarts, [echarts]", inputs: ["options", "theme", "initOpts", "merge", "autoResize", "loading", "loadingType", "loadingOpts"], outputs: ["chartInit", "optionsError", "chartClick", "chartDblClick", "chartMouseDown", "chartMouseMove", "chartMouseUp", "chartMouseOver", "chartMouseOut", "chartGlobalOut", "chartContextMenu", "chartHighlight", "chartDownplay", "chartSelectChanged", "chartLegendSelectChanged", "chartLegendSelected", "chartLegendUnselected", "chartLegendLegendSelectAll", "chartLegendLegendInverseSelect", "chartLegendScroll", "chartDataZoom", "chartDataRangeSelected", "chartGraphRoam", "chartGeoRoam", "chartTreeRoam", "chartTimelineChanged", "chartTimelinePlayChanged", "chartRestore", "chartDataViewChanged", "chartMagicTypeChanged", "chartGeoSelectChanged", "chartGeoSelected", "chartGeoUnselected", "chartAxisAreaSelected", "chartBrush", "chartBrushEnd", "chartBrushSelected", "chartGlobalCursorTaken", "chartRendered", "chartFinished"], exportAs: ["echarts"] }] });
|
|
4449
4450
|
}
|
|
4450
4451
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: BasicTimeSeriesGraphComponent, decorators: [{
|
|
4451
4452
|
type: Component,
|
|
4452
|
-
args: [{ selector: 'app-basic-time-series-graph', imports: [NgxEchartsDirective], providers: [SimpleDatePipe, SimpleDateTimePipe], template: "<div echarts [options]=\"graphOptions()\" (chartDataZoom)=\"chartZoom($event)\" [theme]=\"chartTheme()!\" class=\"w-full h-full\"></div>\
|
|
4453
|
+
args: [{ selector: 'app-basic-time-series-graph', imports: [NgxEchartsDirective], providers: [SimpleDatePipe, SimpleDateTimePipe], template: "<div echarts [options]=\"graphOptions()\" (chartDataZoom)=\"chartZoom($event)\" [theme]=\"chartTheme()!\" class=\"w-full h-full\"></div>\n" }]
|
|
4453
4454
|
}], ctorParameters: () => [{ type: SimpleDateTimePipe }], propDecorators: { timeSeries: [{ type: i0.Input, args: [{ isSignal: true, alias: "timeSeries", required: true }] }], desiredTimeFrame: [{ type: i0.Input, args: [{ isSignal: true, alias: "desiredTimeFrame", required: false }] }], primaryColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "primaryColor", required: false }] }] } });
|
|
4454
4455
|
|
|
4455
4456
|
class CardLabeledValueComponent {
|
|
@@ -4471,11 +4472,11 @@ class CardLabeledValueComponent {
|
|
|
4471
4472
|
}, ...(ngDevMode ? [{ debugName: "permissionFunction" }] : []));
|
|
4472
4473
|
hasPermission = toSignal(toObservable(this.permissionFunction).pipe(switchMap(obs => obs)), { initialValue: false });
|
|
4473
4474
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CardLabeledValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4474
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CardLabeledValueComponent, isStandalone: true, selector: "app-card-labeled-value", inputs: { permissions: { classPropertyName: "permissions", publicName: "permissions", isSignal: true, isRequired: false, transformFunction: null }, useAssetPermissions: { classPropertyName: "useAssetPermissions", publicName: "useAssetPermissions", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, editFunction: { classPropertyName: "editFunction", publicName: "editFunction", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<mat-card\
|
|
4475
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: CardLabeledValueComponent, isStandalone: true, selector: "app-card-labeled-value", inputs: { permissions: { classPropertyName: "permissions", publicName: "permissions", isSignal: true, isRequired: false, transformFunction: null }, useAssetPermissions: { classPropertyName: "useAssetPermissions", publicName: "useAssetPermissions", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, editFunction: { classPropertyName: "editFunction", publicName: "editFunction", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<mat-card\n [ngClass]=\"{'cursor-pointer hover:bg-hover-color': editFunction() && hasPermission() }\"\n [matTooltipDisabled]=\"!hasPermission()\" (click)=\"editFunction() && hasPermission() ? editFunction()!() : null\"\n [matTooltip]=\"tooltip() | translate\"\n matTooltipPosition=\"above\"\n>\n <div class=\"flex items-center justify-between p-4 gap-x-4 h-full\">\n <div class=\"flex flex-col w-full h-full overflow-hidden\">\n <div class=\"font-semibold shrink-0\">{{ label() | translate }}</div>\n <div class=\"text-mat-sys-primary flex items-center grow\">\n <ng-content/>\n </div>\n </div>\n @if (editFunction() && hasPermission()) {\n <button mat-icon-button [ngClass]=\"icon() === 'delete' ? 'text-mat-sys-on-error-container' : 'text-mat-sys-primary'\" (click)=\"editFunction()!(); $event.stopPropagation()\">\n <mat-icon>{{ icon() }}</mat-icon>\n </button>\n }\n </div>\n</mat-card>\n", styles: ["mat-card{height:100%;min-height:5.5rem}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
4475
4476
|
}
|
|
4476
4477
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CardLabeledValueComponent, decorators: [{
|
|
4477
4478
|
type: Component,
|
|
4478
|
-
args: [{ selector: 'app-card-labeled-value', imports: [SharedModule], template: "<mat-card\
|
|
4479
|
+
args: [{ selector: 'app-card-labeled-value', imports: [SharedModule], template: "<mat-card\n [ngClass]=\"{'cursor-pointer hover:bg-hover-color': editFunction() && hasPermission() }\"\n [matTooltipDisabled]=\"!hasPermission()\" (click)=\"editFunction() && hasPermission() ? editFunction()!() : null\"\n [matTooltip]=\"tooltip() | translate\"\n matTooltipPosition=\"above\"\n>\n <div class=\"flex items-center justify-between p-4 gap-x-4 h-full\">\n <div class=\"flex flex-col w-full h-full overflow-hidden\">\n <div class=\"font-semibold shrink-0\">{{ label() | translate }}</div>\n <div class=\"text-mat-sys-primary flex items-center grow\">\n <ng-content/>\n </div>\n </div>\n @if (editFunction() && hasPermission()) {\n <button mat-icon-button [ngClass]=\"icon() === 'delete' ? 'text-mat-sys-on-error-container' : 'text-mat-sys-primary'\" (click)=\"editFunction()!(); $event.stopPropagation()\">\n <mat-icon>{{ icon() }}</mat-icon>\n </button>\n }\n </div>\n</mat-card>\n", styles: ["mat-card{height:100%;min-height:5.5rem}\n"] }]
|
|
4479
4480
|
}], propDecorators: { permissions: [{ type: i0.Input, args: [{ isSignal: true, alias: "permissions", required: false }] }], useAssetPermissions: [{ type: i0.Input, args: [{ isSignal: true, alias: "useAssetPermissions", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], tooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "tooltip", required: false }] }], editFunction: [{ type: i0.Input, args: [{ isSignal: true, alias: "editFunction", required: false }] }] } });
|
|
4480
4481
|
|
|
4481
4482
|
class ConfirmationDialogComponent {
|
|
@@ -4489,11 +4490,11 @@ class ConfirmationDialogComponent {
|
|
|
4489
4490
|
this.dialog.close(true);
|
|
4490
4491
|
}
|
|
4491
4492
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ConfirmationDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: i1$5.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
4492
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: ConfirmationDialogComponent, isStandalone: true, selector: "app-confirmation-dialog", ngImport: i0, template: "<div class=\"flex flex-col flex-auto gap-y-8 p-4 content\">\
|
|
4493
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: ConfirmationDialogComponent, isStandalone: true, selector: "app-confirmation-dialog", ngImport: i0, template: "<div class=\"flex flex-col flex-auto gap-y-8 p-4 content\">\n <div class=\"text-lg\">{{ 'COMMON.CONFIRMATION_DIALOG_TITLE' | translate }}</div>\n <div class=\"flex flex-col flex-auto gap-y-4\">\n <div class=\"flex flex-col flex-auto gap-y-4 max-h-96 overflow-hidden\">\n <div class=\"whitespace-pre-line\">{{ data.message | translate:data.parameters }}</div>\n </div>\n </div>\n <div class=\"flex flex-row flex-auto gap-x-2 justify-end\">\n <button mat-button mat-dialog-close>{{ 'COMMON.CANCEL' | translate }}</button>\n <button [ngClass]=\"{'destructive-flat-button': data.deleteDialog}\" mat-flat-button\n (click)=\"confirm()\">{{ data.actionButtonLabel ? (data.actionButtonLabel! | translate) : (data.deleteDialog ? ('COMMON.DELETE' | translate) : ('COMMON.CONFIRMATION_DIALOG_CONFIRM' | translate)) }}\n </button>\n </div>\n</div>\n", styles: [".content{max-width:var(--medium-dialog-width)}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i1$5.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
4493
4494
|
}
|
|
4494
4495
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ConfirmationDialogComponent, decorators: [{
|
|
4495
4496
|
type: Component,
|
|
4496
|
-
args: [{ selector: 'app-confirmation-dialog', imports: [SharedModule], template: "<div class=\"flex flex-col flex-auto gap-y-8 p-4 content\">\
|
|
4497
|
+
args: [{ selector: 'app-confirmation-dialog', imports: [SharedModule], template: "<div class=\"flex flex-col flex-auto gap-y-8 p-4 content\">\n <div class=\"text-lg\">{{ 'COMMON.CONFIRMATION_DIALOG_TITLE' | translate }}</div>\n <div class=\"flex flex-col flex-auto gap-y-4\">\n <div class=\"flex flex-col flex-auto gap-y-4 max-h-96 overflow-hidden\">\n <div class=\"whitespace-pre-line\">{{ data.message | translate:data.parameters }}</div>\n </div>\n </div>\n <div class=\"flex flex-row flex-auto gap-x-2 justify-end\">\n <button mat-button mat-dialog-close>{{ 'COMMON.CANCEL' | translate }}</button>\n <button [ngClass]=\"{'destructive-flat-button': data.deleteDialog}\" mat-flat-button\n (click)=\"confirm()\">{{ data.actionButtonLabel ? (data.actionButtonLabel! | translate) : (data.deleteDialog ? ('COMMON.DELETE' | translate) : ('COMMON.CONFIRMATION_DIALOG_CONFIRM' | translate)) }}\n </button>\n </div>\n</div>\n", styles: [".content{max-width:var(--medium-dialog-width)}\n"] }]
|
|
4497
4498
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
4498
4499
|
type: Inject,
|
|
4499
4500
|
args: [MAT_DIALOG_DATA]
|
|
@@ -4654,7 +4655,7 @@ class DateRangeInputComponent {
|
|
|
4654
4655
|
useExisting: forwardRef(() => DateRangeInputComponent),
|
|
4655
4656
|
multi: true,
|
|
4656
4657
|
}
|
|
4657
|
-
], viewQueries: [{ propertyName: "datePicker", first: true, predicate: ["picker"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"w-full flex flex-col\" [formGroup]=\"dateRangeForm\">\
|
|
4658
|
+
], viewQueries: [{ propertyName: "datePicker", first: true, predicate: ["picker"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"w-full flex flex-col\" [formGroup]=\"dateRangeForm\">\n @if (isInForm()) {\n <mat-form-field class=\"flex\">\n <mat-label>{{ (translationPrefix() ? translationPrefix() + '_LABEL' : 'COMMON.DATE_RANGE_LABEL') | translate }}</mat-label>\n <mat-select (blur)=\"onTouched($event)\" formControlName=\"periodOption\" (selectionChange)=\"onTimeRangeChanged($event)\" [errorStateMatcher]=\"periodErrorStateMatcher\" panelClass=\"date-range-panel\">\n @for (periodOption of availableDateOptions(); track $index) {\n <mat-option [value]=\"periodOption\">{{ 'COMMON.RELATIVE_TIME_PERIOD_' + periodOption | translate }}</mat-option>\n }\n @if (allowCustomTimespan()) {\n <mat-option [value]=\"CUSTOM_PERIOD\">\n <div class=\"flex flex-row gap-x-4\">\n @if (dateRangeForm.get('from')?.value) {\n <div class=\"flex flex-row\">\n <span class=\"whitespace-nowrap h-fit\">{{ dateRangeForm.get('from')?.value?.toMillis() | simpleDate : undefined: false }}</span>\n <span class=\"whitespace-nowrap h-fit\"> - </span>\n <span class=\"whitespace-nowrap h-fit\">{{ dateRangeForm.get('to')?.value?.toMillis() | simpleDate : undefined: false }}</span>\n </div>\n } @else {\n <div>{{ 'COMMON.RELATIVE_TIME_PERIOD_CUSTOM' | translate }}</div>\n }\n </div>\n </mat-option>\n }\n </mat-select>\n <mat-date-range-input [rangePicker]=\"picker\" style=\"visibility: hidden; width: 0; height: 0;\">\n <input (blur)=\"onTouched($event)\" matStartDate formControlName=\"from\">\n <input (blur)=\"onTouched($event)\" matEndDate formControlName=\"to\"/>\n </mat-date-range-input>\n <mat-date-range-picker #picker (closed)=\"emitValueChange()\"></mat-date-range-picker>\n @if (dateRangeForm.get('periodOption')?.value === CUSTOM_PERIOD) {\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n }\n @if (dateRangeForm.touched && dateRangeForm.hasError('required')) {\n <mat-error>\n {{ 'COMMON.ERROR_VALIDATION_REQUIRED' | translate }}\n </mat-error>\n }\n @if (dateRangeForm.touched && dateRangeForm.hasError('incompletePeriod')) {\n {{ 'COMMON.ERROR_VALIDATION_REQUIRED' | translate }}\n }\n </mat-form-field>\n } @else {\n <div class=\"flex\">\n <mat-select class=\"date-range-flat-picker-select\" (blur)=\"onTouched($event)\" formControlName=\"periodOption\" (selectionChange)=\"onTimeRangeChanged($event)\" [errorStateMatcher]=\"periodErrorStateMatcher\" panelClass=\"date-range-panel\">\n @for (periodOption of availableDateOptions(); track $index) {\n <mat-option [value]=\"periodOption\">{{ 'COMMON.RELATIVE_TIME_PERIOD_' + periodOption | translate }}</mat-option>\n }\n @if (allowCustomTimespan()) {\n <mat-option [value]=\"CUSTOM_PERIOD\">\n <div class=\"flex flex-row gap-x-4\">\n @if (dateRangeForm.get('from')?.value) {\n <div class=\"flex flex-row\">\n <span class=\"whitespace-nowrap h-fit\">{{ dateRangeForm.get('from')?.value?.toMillis() | simpleDate : undefined: false }}</span>\n <span class=\"whitespace-nowrap h-fit\"> - </span>\n <span class=\"whitespace-nowrap h-fit\">{{ dateRangeForm.get('to')?.value?.toMillis() | simpleDate : undefined: false }}</span>\n </div>\n } @else {\n <div>{{ 'COMMON.RELATIVE_TIME_PERIOD_CUSTOM' | translate }}</div>\n }\n </div>\n </mat-option>\n }\n </mat-select>\n <mat-date-range-input [rangePicker]=\"picker\" style=\"visibility: hidden; width: 0; height: 0;\">\n <input (blur)=\"onTouched($event)\" matStartDate formControlName=\"from\">\n <input (blur)=\"onTouched($event)\" matEndDate formControlName=\"to\"/>\n </mat-date-range-input>\n <mat-date-range-picker #picker (closed)=\"emitValueChange()\"></mat-date-range-picker>\n @if (dateRangeForm.get('periodOption')?.value === CUSTOM_PERIOD) {\n <mat-datepicker-toggle matSuffix [for]=\"picker\" class=\"date-range-flat-picker-toggle\"></mat-datepicker-toggle>\n }\n </div>\n }\n</div>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i4$3.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: i4$3.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i4$3.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i4$3.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i4$3.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: SimpleDatePipe, name: "simpleDate" }] });
|
|
4658
4659
|
}
|
|
4659
4660
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DateRangeInputComponent, decorators: [{
|
|
4660
4661
|
type: Component,
|
|
@@ -4669,7 +4670,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
4669
4670
|
useExisting: forwardRef(() => DateRangeInputComponent),
|
|
4670
4671
|
multi: true,
|
|
4671
4672
|
}
|
|
4672
|
-
], template: "<div class=\"w-full flex flex-col\" [formGroup]=\"dateRangeForm\">\
|
|
4673
|
+
], template: "<div class=\"w-full flex flex-col\" [formGroup]=\"dateRangeForm\">\n @if (isInForm()) {\n <mat-form-field class=\"flex\">\n <mat-label>{{ (translationPrefix() ? translationPrefix() + '_LABEL' : 'COMMON.DATE_RANGE_LABEL') | translate }}</mat-label>\n <mat-select (blur)=\"onTouched($event)\" formControlName=\"periodOption\" (selectionChange)=\"onTimeRangeChanged($event)\" [errorStateMatcher]=\"periodErrorStateMatcher\" panelClass=\"date-range-panel\">\n @for (periodOption of availableDateOptions(); track $index) {\n <mat-option [value]=\"periodOption\">{{ 'COMMON.RELATIVE_TIME_PERIOD_' + periodOption | translate }}</mat-option>\n }\n @if (allowCustomTimespan()) {\n <mat-option [value]=\"CUSTOM_PERIOD\">\n <div class=\"flex flex-row gap-x-4\">\n @if (dateRangeForm.get('from')?.value) {\n <div class=\"flex flex-row\">\n <span class=\"whitespace-nowrap h-fit\">{{ dateRangeForm.get('from')?.value?.toMillis() | simpleDate : undefined: false }}</span>\n <span class=\"whitespace-nowrap h-fit\"> - </span>\n <span class=\"whitespace-nowrap h-fit\">{{ dateRangeForm.get('to')?.value?.toMillis() | simpleDate : undefined: false }}</span>\n </div>\n } @else {\n <div>{{ 'COMMON.RELATIVE_TIME_PERIOD_CUSTOM' | translate }}</div>\n }\n </div>\n </mat-option>\n }\n </mat-select>\n <mat-date-range-input [rangePicker]=\"picker\" style=\"visibility: hidden; width: 0; height: 0;\">\n <input (blur)=\"onTouched($event)\" matStartDate formControlName=\"from\">\n <input (blur)=\"onTouched($event)\" matEndDate formControlName=\"to\"/>\n </mat-date-range-input>\n <mat-date-range-picker #picker (closed)=\"emitValueChange()\"></mat-date-range-picker>\n @if (dateRangeForm.get('periodOption')?.value === CUSTOM_PERIOD) {\n <mat-datepicker-toggle matSuffix [for]=\"picker\"></mat-datepicker-toggle>\n }\n @if (dateRangeForm.touched && dateRangeForm.hasError('required')) {\n <mat-error>\n {{ 'COMMON.ERROR_VALIDATION_REQUIRED' | translate }}\n </mat-error>\n }\n @if (dateRangeForm.touched && dateRangeForm.hasError('incompletePeriod')) {\n {{ 'COMMON.ERROR_VALIDATION_REQUIRED' | translate }}\n }\n </mat-form-field>\n } @else {\n <div class=\"flex\">\n <mat-select class=\"date-range-flat-picker-select\" (blur)=\"onTouched($event)\" formControlName=\"periodOption\" (selectionChange)=\"onTimeRangeChanged($event)\" [errorStateMatcher]=\"periodErrorStateMatcher\" panelClass=\"date-range-panel\">\n @for (periodOption of availableDateOptions(); track $index) {\n <mat-option [value]=\"periodOption\">{{ 'COMMON.RELATIVE_TIME_PERIOD_' + periodOption | translate }}</mat-option>\n }\n @if (allowCustomTimespan()) {\n <mat-option [value]=\"CUSTOM_PERIOD\">\n <div class=\"flex flex-row gap-x-4\">\n @if (dateRangeForm.get('from')?.value) {\n <div class=\"flex flex-row\">\n <span class=\"whitespace-nowrap h-fit\">{{ dateRangeForm.get('from')?.value?.toMillis() | simpleDate : undefined: false }}</span>\n <span class=\"whitespace-nowrap h-fit\"> - </span>\n <span class=\"whitespace-nowrap h-fit\">{{ dateRangeForm.get('to')?.value?.toMillis() | simpleDate : undefined: false }}</span>\n </div>\n } @else {\n <div>{{ 'COMMON.RELATIVE_TIME_PERIOD_CUSTOM' | translate }}</div>\n }\n </div>\n </mat-option>\n }\n </mat-select>\n <mat-date-range-input [rangePicker]=\"picker\" style=\"visibility: hidden; width: 0; height: 0;\">\n <input (blur)=\"onTouched($event)\" matStartDate formControlName=\"from\">\n <input (blur)=\"onTouched($event)\" matEndDate formControlName=\"to\"/>\n </mat-date-range-input>\n <mat-date-range-picker #picker (closed)=\"emitValueChange()\"></mat-date-range-picker>\n @if (dateRangeForm.get('periodOption')?.value === CUSTOM_PERIOD) {\n <mat-datepicker-toggle matSuffix [for]=\"picker\" class=\"date-range-flat-picker-toggle\"></mat-datepicker-toggle>\n }\n </div>\n }\n</div>\n", styles: [":host{display:block}\n"] }]
|
|
4673
4674
|
}], ctorParameters: () => [{ type: i0.DestroyRef }, { type: TenantPropertiesService }], propDecorators: { availableDateOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "availableDateOptions", required: false }] }], translationPrefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "translationPrefix", required: false }] }], allowCustomTimespan: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowCustomTimespan", required: false }] }], isInForm: [{ type: i0.Input, args: [{ isSignal: true, alias: "isInForm", required: false }] }], datePicker: [{ type: i0.ViewChild, args: ['picker', { isSignal: true }] }], validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }] } });
|
|
4674
4675
|
|
|
4675
4676
|
class DateTimeFormFieldComponent {
|
|
@@ -4778,7 +4779,7 @@ class DateTimeFormFieldComponent {
|
|
|
4778
4779
|
useExisting: forwardRef(() => DateTimeFormFieldComponent),
|
|
4779
4780
|
multi: true,
|
|
4780
4781
|
}
|
|
4781
|
-
], ngImport: i0, template: "<ng-container [formGroup]=\"formGroup\">\
|
|
4782
|
+
], ngImport: i0, template: "<ng-container [formGroup]=\"formGroup\">\n <div class=\"flex flex-col gap-y-4\">\n <mat-form-field [matTooltip]=\"getDateErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ (dateLabel ?? 'COMMON.DATE') | translate }}</mat-label>\n <input [matDatepicker]=\"picker\" formControlName=\"date\" matInput>\n <mat-datepicker-toggle [for]=\"picker\" matIconSuffix></mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n @for (error of getDateErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\" class=\"text-[12px]\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate }}</mat-error>\n }\n </mat-form-field>\n <mat-form-field [matTooltip]=\"getTimeErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ (timeLabel ?? 'COMMON.TIME') | translate }}</mat-label>\n <input [format]=\"24\" [ngxMatTimepicker]=\"pickerA\" formControlName=\"time\" matInput (input)=\"onInputChange($event)\"/>\n <mat-icon (click)=\"pickerA.open()\" matSuffix> watch_later</mat-icon>\n <ngx-mat-timepicker #pickerA></ngx-mat-timepicker>\n @for (error of getTimeErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\" class=\"text-[12px]\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate }}</mat-error>\n }\n </mat-form-field>\n </div>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i4$3.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i4$3.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i4$3.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgxMatTimepickerDirective, selector: "[ngxMatTimepicker]", inputs: ["format", "max", "min", "ngxMatTimepicker", "value", "disableClick", "disabled"] }, { kind: "component", type: NgxMatTimepickerComponent, selector: "ngx-mat-timepicker", inputs: ["appendToInput", "color", "dottedMinutesInGap", "enableKeyboardInput", "format", "minutesGap", "cancelBtnTmpl", "confirmBtnTmpl", "defaultTime", "disableAnimation", "editableHintTmpl", "hoursOnly", "isEsc", "max", "min", "preventOverlayClick", "timepickerClass"], outputs: ["closed", "hourSelected", "opened", "timeChanged", "timeSet"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
4782
4783
|
}
|
|
4783
4784
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DateTimeFormFieldComponent, decorators: [{
|
|
4784
4785
|
type: Component,
|
|
@@ -4793,7 +4794,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
4793
4794
|
useExisting: forwardRef(() => DateTimeFormFieldComponent),
|
|
4794
4795
|
multi: true,
|
|
4795
4796
|
}
|
|
4796
|
-
], template: "<ng-container [formGroup]=\"formGroup\">\
|
|
4797
|
+
], template: "<ng-container [formGroup]=\"formGroup\">\n <div class=\"flex flex-col gap-y-4\">\n <mat-form-field [matTooltip]=\"getDateErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ (dateLabel ?? 'COMMON.DATE') | translate }}</mat-label>\n <input [matDatepicker]=\"picker\" formControlName=\"date\" matInput>\n <mat-datepicker-toggle [for]=\"picker\" matIconSuffix></mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n @for (error of getDateErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\" class=\"text-[12px]\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate }}</mat-error>\n }\n </mat-form-field>\n <mat-form-field [matTooltip]=\"getTimeErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ (timeLabel ?? 'COMMON.TIME') | translate }}</mat-label>\n <input [format]=\"24\" [ngxMatTimepicker]=\"pickerA\" formControlName=\"time\" matInput (input)=\"onInputChange($event)\"/>\n <mat-icon (click)=\"pickerA.open()\" matSuffix> watch_later</mat-icon>\n <ngx-mat-timepicker #pickerA></ngx-mat-timepicker>\n @for (error of getTimeErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\" class=\"text-[12px]\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate }}</mat-error>\n }\n </mat-form-field>\n </div>\n</ng-container>\n" }]
|
|
4797
4798
|
}], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { dateLabel: [{
|
|
4798
4799
|
type: Input
|
|
4799
4800
|
}], timeLabel: [{
|
|
@@ -4922,11 +4923,11 @@ class DragDropFileUploadComponent {
|
|
|
4922
4923
|
this.destroy$.complete();
|
|
4923
4924
|
}
|
|
4924
4925
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DragDropFileUploadComponent, deps: [{ token: i5.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
4925
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DragDropFileUploadComponent, isStandalone: true, selector: "application-drag-drop-file-upload", inputs: { accept: "accept", multiple: "multiple", prompt: "prompt" }, viewQueries: [{ propertyName: "dragDropZone", first: true, predicate: ["dragDropZone"], descendants: true }, { propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div #dragDropZone class=\"drag-drop-zone flex flex-col items-center justify-center\" [ngClass]=\"{ highlight: highlight(), disabled: disabled() }\">\
|
|
4926
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DragDropFileUploadComponent, isStandalone: true, selector: "application-drag-drop-file-upload", inputs: { accept: "accept", multiple: "multiple", prompt: "prompt" }, viewQueries: [{ propertyName: "dragDropZone", first: true, predicate: ["dragDropZone"], descendants: true }, { propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<div #dragDropZone class=\"drag-drop-zone flex flex-col items-center justify-center\" [ngClass]=\"{ highlight: highlight(), disabled: disabled() }\">\n @if (files$ | async; as files) {\n @if (files.length > 0) {\n <div class=\"flex flex-col flex-wrap items-center justify-center\">\n @for (file of files; track $index) {\n <div class=\"name-wrapper flex flex-row items-center justify-center gap-2\">\n <mat-icon>description</mat-icon>\n <span [matTooltipDisabled]=\"file.name.length < TRUNCATE_NAME_LIMIT\" [matTooltip]=\"file.name\">{{ getFileName(file.name) }}</span>\n <mat-icon class=\"delete-button text-mat-sys-on-error-container\" (click)=\"deleteFile($event, $index)\">delete</mat-icon>\n </div>\n }\n </div>\n } @else {\n <span>{{ prompt | translate }}</span>\n }\n } @else {\n <span>{{ prompt | translate }}</span>\n }\n @if (controlDir.control?.errors && controlDir.control?.touched) {\n <mat-error>{{ getErrorForTranslation(controlDir.control?.errors).key | translate: getErrorForTranslation(controlDir.control?.errors).params }}</mat-error>\n }\n</div>\n<input #fileInput type=\"file\" [attr.multiple]=\"multiple ? true : null\" [attr.accept]=\"accept === '.*' ? '*' : accept\" (change)=\"onFileAdded($event)\"/>\n", styles: [":host{display:block;position:relative}input[type=file]{display:none}.drag-drop-zone{min-height:100px;min-width:250px;border:1px dashed var(--neutral-variant-color-60);cursor:pointer;border-radius:5px}.drag-drop-zone.highlight{background-color:var(--mat-sys-primary-container);border:1px solid var(--mat-sys-on-primary-container)}.drag-drop-zone.disabled{opacity:.5;pointer-events:none;cursor:no-drop}.drag-drop-zone .name-wrapper{cursor:auto}.drag-drop-zone .delete-button{cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }] });
|
|
4926
4927
|
}
|
|
4927
4928
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DragDropFileUploadComponent, decorators: [{
|
|
4928
4929
|
type: Component,
|
|
4929
|
-
args: [{ selector: 'application-drag-drop-file-upload', imports: [SharedModule], template: "<div #dragDropZone class=\"drag-drop-zone flex flex-col items-center justify-center\" [ngClass]=\"{ highlight: highlight(), disabled: disabled() }\">\
|
|
4930
|
+
args: [{ selector: 'application-drag-drop-file-upload', imports: [SharedModule], template: "<div #dragDropZone class=\"drag-drop-zone flex flex-col items-center justify-center\" [ngClass]=\"{ highlight: highlight(), disabled: disabled() }\">\n @if (files$ | async; as files) {\n @if (files.length > 0) {\n <div class=\"flex flex-col flex-wrap items-center justify-center\">\n @for (file of files; track $index) {\n <div class=\"name-wrapper flex flex-row items-center justify-center gap-2\">\n <mat-icon>description</mat-icon>\n <span [matTooltipDisabled]=\"file.name.length < TRUNCATE_NAME_LIMIT\" [matTooltip]=\"file.name\">{{ getFileName(file.name) }}</span>\n <mat-icon class=\"delete-button text-mat-sys-on-error-container\" (click)=\"deleteFile($event, $index)\">delete</mat-icon>\n </div>\n }\n </div>\n } @else {\n <span>{{ prompt | translate }}</span>\n }\n } @else {\n <span>{{ prompt | translate }}</span>\n }\n @if (controlDir.control?.errors && controlDir.control?.touched) {\n <mat-error>{{ getErrorForTranslation(controlDir.control?.errors).key | translate: getErrorForTranslation(controlDir.control?.errors).params }}</mat-error>\n }\n</div>\n<input #fileInput type=\"file\" [attr.multiple]=\"multiple ? true : null\" [attr.accept]=\"accept === '.*' ? '*' : accept\" (change)=\"onFileAdded($event)\"/>\n", styles: [":host{display:block;position:relative}input[type=file]{display:none}.drag-drop-zone{min-height:100px;min-width:250px;border:1px dashed var(--neutral-variant-color-60);cursor:pointer;border-radius:5px}.drag-drop-zone.highlight{background-color:var(--mat-sys-primary-container);border:1px solid var(--mat-sys-on-primary-container)}.drag-drop-zone.disabled{opacity:.5;pointer-events:none;cursor:no-drop}.drag-drop-zone .name-wrapper{cursor:auto}.drag-drop-zone .delete-button{cursor:pointer}\n"] }]
|
|
4930
4931
|
}], ctorParameters: () => [{ type: i5.NgControl, decorators: [{
|
|
4931
4932
|
type: Optional
|
|
4932
4933
|
}, {
|
|
@@ -5035,13 +5036,13 @@ class GoogleMapComponent {
|
|
|
5035
5036
|
const isOffset = mapItem.trueLat !== undefined && mapItem.trueLng !== undefined;
|
|
5036
5037
|
const lastReading = isOffset ? mapItem.trueLat + ',' + mapItem.trueLng : mapItem.lat + ',' + mapItem.lng;
|
|
5037
5038
|
const offsetNotification = isOffset ? `<span>${this.translateService.instant('DASHBOARDS.MAP_WIDGET_OFFSET_NOTIFICATION')}</span>` : '';
|
|
5038
|
-
const infoWindowContent = `
|
|
5039
|
-
<div class="text-black flex flex-col gap-y-2 mt-4 !w-fit !h-fit select-none">
|
|
5040
|
-
<span class="font-bold">${mapItem.path}</span>
|
|
5041
|
-
<span>${lastReadingTime ? this.simpleDateTimePipe.transform(lastReadingTime) : ''}</span>
|
|
5042
|
-
<span class="font-bold mt-4">${lastReading}</span>
|
|
5043
|
-
${offsetNotification}
|
|
5044
|
-
</div>
|
|
5039
|
+
const infoWindowContent = `
|
|
5040
|
+
<div class="text-black flex flex-col gap-y-2 mt-4 !w-fit !h-fit select-none">
|
|
5041
|
+
<span class="font-bold">${mapItem.path}</span>
|
|
5042
|
+
<span>${lastReadingTime ? this.simpleDateTimePipe.transform(lastReadingTime) : ''}</span>
|
|
5043
|
+
<span class="font-bold mt-4">${lastReading}</span>
|
|
5044
|
+
${offsetNotification}
|
|
5045
|
+
</div>
|
|
5045
5046
|
`;
|
|
5046
5047
|
const infoWindow = new google.maps.InfoWindow({
|
|
5047
5048
|
content: infoWindowContent,
|
|
@@ -5049,10 +5050,10 @@ class GoogleMapComponent {
|
|
|
5049
5050
|
pixelOffset: new google.maps.Size(0, -4)
|
|
5050
5051
|
});
|
|
5051
5052
|
const pin = document.createElement('div');
|
|
5052
|
-
pin.innerHTML = `
|
|
5053
|
-
<svg width="48" height="48" viewBox="0 0 24 24" fill="${mapItem.color}">
|
|
5054
|
-
<path d="M10.453 14.016zM12 2.016q2.906 0 4.945 2.039t2.039 4.945q0 1.453-.727 3.328t-1.758 3.516-2.039 3.07-1.711 2.273l-.75.797q-.281-.328-.75-.867t-1.688-2.156-2.133-3.141-1.664-3.445-.75-3.375q0-2.906 2.039-4.945t4.945-2.039z"></path>
|
|
5055
|
-
</svg>
|
|
5053
|
+
pin.innerHTML = `
|
|
5054
|
+
<svg width="48" height="48" viewBox="0 0 24 24" fill="${mapItem.color}">
|
|
5055
|
+
<path d="M10.453 14.016zM12 2.016q2.906 0 4.945 2.039t2.039 4.945q0 1.453-.727 3.328t-1.758 3.516-2.039 3.07-1.711 2.273l-.75.797q-.281-.328-.75-.867t-1.688-2.156-2.133-3.141-1.664-3.445-.75-3.375q0-2.906 2.039-4.945t4.945-2.039z"></path>
|
|
5056
|
+
</svg>
|
|
5056
5057
|
`;
|
|
5057
5058
|
const marker = new google.maps.marker.AdvancedMarkerElement({
|
|
5058
5059
|
position: { lat: +mapItem.lat, lng: +mapItem.lng },
|
|
@@ -5114,11 +5115,11 @@ class GoogleMapComponent {
|
|
|
5114
5115
|
return result;
|
|
5115
5116
|
}
|
|
5116
5117
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: GoogleMapComponent, deps: [{ token: i1$1.TranslateService }, { token: SimpleDateTimePipe }], target: i0.ɵɵFactoryTarget.Component });
|
|
5117
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.0", type: GoogleMapComponent, isStandalone: true, selector: "app-google-map", inputs: { googleMapId: { classPropertyName: "googleMapId", publicName: "googleMapId", isSignal: true, isRequired: true, transformFunction: null }, darkTheme: { classPropertyName: "darkTheme", publicName: "darkTheme", isSignal: true, isRequired: true, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, pinColor: { classPropertyName: "pinColor", publicName: "pinColor", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { markerClicked: "markerClicked" }, providers: [SimpleDateTimePipe], viewQueries: [{ propertyName: "map", first: true, predicate: GoogleMap, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"map-wrapper\">\
|
|
5118
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.0", type: GoogleMapComponent, isStandalone: true, selector: "app-google-map", inputs: { googleMapId: { classPropertyName: "googleMapId", publicName: "googleMapId", isSignal: true, isRequired: true, transformFunction: null }, darkTheme: { classPropertyName: "darkTheme", publicName: "darkTheme", isSignal: true, isRequired: true, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, pinColor: { classPropertyName: "pinColor", publicName: "pinColor", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { markerClicked: "markerClicked" }, providers: [SimpleDateTimePipe], viewQueries: [{ propertyName: "map", first: true, predicate: GoogleMap, descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"map-wrapper\">\n <google-map height=\"100%\" width=\"100%\" [options]=\"mapOptions()\" [zoom]=\"zoom()\" class=\"map-full\"/>\n <div class=\"map-controls\">\n <mat-card>\n <button mat-mini-fab (click)=\"fitBounds()\" class=\"text-mat-sys-on-surface\" type=\"button\">\n <mat-icon>filter_center_focus</mat-icon>\n </button>\n </mat-card>\n <mat-card>\n <button mat-mini-fab (click)=\"changeZoom(+1)\" [disabled]=\"zoom() === 21\" class=\"text-mat-sys-on-surface\" type=\"button\">\n <mat-icon>add</mat-icon>\n </button>\n </mat-card>\n <mat-card>\n <button mat-mini-fab (click)=\"changeZoom(-1)\" [disabled]=\"zoom() === 2\" class=\"text-mat-sys-on-surface\" type=\"button\">\n <mat-icon>remove</mat-icon>\n </button>\n </mat-card>\n </div>\n</div>\n", styles: [".map-wrapper{display:flex;width:100%;height:100%}.map-full{width:100%;height:100%}.map-controls{position:absolute;bottom:1.75rem;right:.75rem;display:flex;flex-direction:column;row-gap:.25rem}.map-controls mat-card{border:none!important}.map-controls button{background-color:transparent!important}\n"], dependencies: [{ kind: "component", type: GoogleMap, selector: "google-map", inputs: ["height", "width", "mapId", "mapTypeId", "center", "zoom", "options"], outputs: ["mapInitialized", "authFailure", "boundsChanged", "centerChanged", "mapClick", "mapDblclick", "mapDrag", "mapDragend", "mapDragstart", "headingChanged", "idle", "maptypeidChanged", "mapMousemove", "mapMouseout", "mapMouseover", "projectionChanged", "mapRightclick", "tilesloaded", "tiltChanged", "zoomChanged"], exportAs: ["googleMap"] }, { kind: "ngmodule", type: SharedModule }, { kind: "component", type: i1$4.MatMiniFabButton, selector: "button[mat-mini-fab], a[mat-mini-fab], button[matMiniFab], a[matMiniFab]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }] });
|
|
5118
5119
|
}
|
|
5119
5120
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: GoogleMapComponent, decorators: [{
|
|
5120
5121
|
type: Component,
|
|
5121
|
-
args: [{ selector: 'app-google-map', imports: [GoogleMap, SharedModule], providers: [SimpleDateTimePipe], template: "<div class=\"map-wrapper\">\
|
|
5122
|
+
args: [{ selector: 'app-google-map', imports: [GoogleMap, SharedModule], providers: [SimpleDateTimePipe], template: "<div class=\"map-wrapper\">\n <google-map height=\"100%\" width=\"100%\" [options]=\"mapOptions()\" [zoom]=\"zoom()\" class=\"map-full\"/>\n <div class=\"map-controls\">\n <mat-card>\n <button mat-mini-fab (click)=\"fitBounds()\" class=\"text-mat-sys-on-surface\" type=\"button\">\n <mat-icon>filter_center_focus</mat-icon>\n </button>\n </mat-card>\n <mat-card>\n <button mat-mini-fab (click)=\"changeZoom(+1)\" [disabled]=\"zoom() === 21\" class=\"text-mat-sys-on-surface\" type=\"button\">\n <mat-icon>add</mat-icon>\n </button>\n </mat-card>\n <mat-card>\n <button mat-mini-fab (click)=\"changeZoom(-1)\" [disabled]=\"zoom() === 2\" class=\"text-mat-sys-on-surface\" type=\"button\">\n <mat-icon>remove</mat-icon>\n </button>\n </mat-card>\n </div>\n</div>\n", styles: [".map-wrapper{display:flex;width:100%;height:100%}.map-full{width:100%;height:100%}.map-controls{position:absolute;bottom:1.75rem;right:.75rem;display:flex;flex-direction:column;row-gap:.25rem}.map-controls mat-card{border:none!important}.map-controls button{background-color:transparent!important}\n"] }]
|
|
5122
5123
|
}], ctorParameters: () => [{ type: i1$1.TranslateService }, { type: SimpleDateTimePipe }], propDecorators: { map: [{ type: i0.ViewChild, args: [i0.forwardRef(() => GoogleMap), { isSignal: true }] }], googleMapId: [{ type: i0.Input, args: [{ isSignal: true, alias: "googleMapId", required: true }] }], darkTheme: [{ type: i0.Input, args: [{ isSignal: true, alias: "darkTheme", required: true }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], pinColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "pinColor", required: true }] }], markerClicked: [{ type: i0.Output, args: ["markerClicked"] }] } });
|
|
5123
5124
|
|
|
5124
5125
|
class ImagePreviewComponent {
|
|
@@ -5157,11 +5158,11 @@ class ImagePreviewComponent {
|
|
|
5157
5158
|
return image !== null && image.constructor.name === 'SafeHtmlImpl';
|
|
5158
5159
|
}
|
|
5159
5160
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ImagePreviewComponent, deps: [{ token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
5160
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ImagePreviewComponent, isStandalone: true, selector: "app-image-preview", viewQueries: [{ propertyName: "image", first: true, predicate: ["imageElement"], descendants: true }, { propertyName: "svgElement", first: true, predicate: ["svgElement"], descendants: true }], ngImport: i0, template: "<div class=\"relative overflow-hidden image-wrapper flex flex-col items-center justify-center\" [ngStyle]=\"dimensionStyles() ? dimensionStyles() : {'opacity': '0'}\">\
|
|
5161
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ImagePreviewComponent, isStandalone: true, selector: "app-image-preview", viewQueries: [{ propertyName: "image", first: true, predicate: ["imageElement"], descendants: true }, { propertyName: "svgElement", first: true, predicate: ["svgElement"], descendants: true }], ngImport: i0, template: "<div class=\"relative overflow-hidden image-wrapper flex flex-col items-center justify-center\" [ngStyle]=\"dimensionStyles() ? dimensionStyles() : {'opacity': '0'}\">\n <mat-icon class=\"absolute top-4 right-4 hover:cursor-pointer text-mat-sys-on-error-container\" matDialogClose>close</mat-icon>\n @if (!isHtml(data.image)) {\n <img #imageElement [attr.src]=\"data.image\" alt=\"ImagePreview\"/>\n } @else {\n <div #svgElement class=\"p-4\" [innerHTML]=\"data.image\"></div>\n }\n</div>\n", styles: [".image-wrapper{min-height:124px;min-width:124px}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1$5.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i9.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
5161
5162
|
}
|
|
5162
5163
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ImagePreviewComponent, decorators: [{
|
|
5163
5164
|
type: Component,
|
|
5164
|
-
args: [{ selector: 'app-image-preview', imports: [SharedModule], template: "<div class=\"relative overflow-hidden image-wrapper flex flex-col items-center justify-center\" [ngStyle]=\"dimensionStyles() ? dimensionStyles() : {'opacity': '0'}\">\
|
|
5165
|
+
args: [{ selector: 'app-image-preview', imports: [SharedModule], template: "<div class=\"relative overflow-hidden image-wrapper flex flex-col items-center justify-center\" [ngStyle]=\"dimensionStyles() ? dimensionStyles() : {'opacity': '0'}\">\n <mat-icon class=\"absolute top-4 right-4 hover:cursor-pointer text-mat-sys-on-error-container\" matDialogClose>close</mat-icon>\n @if (!isHtml(data.image)) {\n <img #imageElement [attr.src]=\"data.image\" alt=\"ImagePreview\"/>\n } @else {\n <div #svgElement class=\"p-4\" [innerHTML]=\"data.image\"></div>\n }\n</div>\n", styles: [".image-wrapper{min-height:124px;min-width:124px}\n"] }]
|
|
5165
5166
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
5166
5167
|
type: Inject,
|
|
5167
5168
|
args: [MAT_DIALOG_DATA]
|
|
@@ -5196,21 +5197,21 @@ class ImageDisplayComponent {
|
|
|
5196
5197
|
});
|
|
5197
5198
|
}
|
|
5198
5199
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ImageDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5199
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ImageDisplayComponent, isStandalone: true, selector: "app-image-display", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@if (imageUrl(); as image) {\
|
|
5200
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ImageDisplayComponent, isStandalone: true, selector: "app-image-display", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@if (imageUrl(); as image) {\n @if (isHtml(image)) {\n <div (click)=\"openImage(image)\" [innerHTML]=\"image\" class=\"max-h-full h-full w-full object-contain block mt-1 hover:cursor-pointer\"></div>\n } @else {\n <img (click)=\"openImage(image)\" [attr.src]=\"image\" class=\"max-h-full h-full w-full object-contain block mt-1 hover:cursor-pointer\" alt=\"\"/>\n }\n}\n", styles: [""] });
|
|
5200
5201
|
}
|
|
5201
5202
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ImageDisplayComponent, decorators: [{
|
|
5202
5203
|
type: Component,
|
|
5203
|
-
args: [{ selector: 'app-image-display', imports: [], template: "@if (imageUrl(); as image) {\
|
|
5204
|
+
args: [{ selector: 'app-image-display', imports: [], template: "@if (imageUrl(); as image) {\n @if (isHtml(image)) {\n <div (click)=\"openImage(image)\" [innerHTML]=\"image\" class=\"max-h-full h-full w-full object-contain block mt-1 hover:cursor-pointer\"></div>\n } @else {\n <img (click)=\"openImage(image)\" [attr.src]=\"image\" class=\"max-h-full h-full w-full object-contain block mt-1 hover:cursor-pointer\" alt=\"\"/>\n }\n}\n" }]
|
|
5204
5205
|
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }] } });
|
|
5205
5206
|
|
|
5206
5207
|
class LabeledValueComponent {
|
|
5207
5208
|
name = input.required(...(ngDevMode ? [{ debugName: "name" }] : []));
|
|
5208
5209
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: LabeledValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5209
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: LabeledValueComponent, isStandalone: true, selector: "app-labeled-value", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-row gap-x-2 items-center\">\
|
|
5210
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: LabeledValueComponent, isStandalone: true, selector: "app-labeled-value", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-row gap-x-2 items-center\">\n <div class=\"font-bold\">{{ name() | translate }}:</div>\n <div class=\"flex flex-row items-center gap-x-2\">\n <ng-content/>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
5210
5211
|
}
|
|
5211
5212
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: LabeledValueComponent, decorators: [{
|
|
5212
5213
|
type: Component,
|
|
5213
|
-
args: [{ selector: 'app-labeled-value', imports: [TranslateModule], template: "<div class=\"flex flex-row gap-x-2 items-center\">\
|
|
5214
|
+
args: [{ selector: 'app-labeled-value', imports: [TranslateModule], template: "<div class=\"flex flex-row gap-x-2 items-center\">\n <div class=\"font-bold\">{{ name() | translate }}:</div>\n <div class=\"flex flex-row items-center gap-x-2\">\n <ng-content/>\n </div>\n</div>\n" }]
|
|
5214
5215
|
}], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }] } });
|
|
5215
5216
|
|
|
5216
5217
|
class LoadedIconComponent {
|
|
@@ -5244,11 +5245,11 @@ class LoadedIconComponent {
|
|
|
5244
5245
|
this.sanitizer = sanitizer;
|
|
5245
5246
|
}
|
|
5246
5247
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: LoadedIconComponent, deps: [{ token: i1$6.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
|
|
5247
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: LoadedIconComponent, isStandalone: true, selector: "app-loaded-icon", inputs: { iconRequest: { classPropertyName: "iconRequest", publicName: "iconRequest", isSignal: true, isRequired: true, transformFunction: null }, defaultIcon: { classPropertyName: "defaultIcon", publicName: "defaultIcon", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div [style.height.px]=\"size()\" [style.width.px]=\"size()\">\
|
|
5248
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: LoadedIconComponent, isStandalone: true, selector: "app-loaded-icon", inputs: { iconRequest: { classPropertyName: "iconRequest", publicName: "iconRequest", isSignal: true, isRequired: true, transformFunction: null }, defaultIcon: { classPropertyName: "defaultIcon", publicName: "defaultIcon", isSignal: true, isRequired: true, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div [style.height.px]=\"size()\" [style.width.px]=\"size()\">\n @if (icon() | async; as icon) {\n <div [innerHTML]=\"icon\"></div>\n } @else {\n @if (isSvgIcon(); as icon) {\n <mat-icon [svgIcon]=\"icon.id\"></mat-icon>\n } @else {\n <mat-icon>{{ defaultIcon() }}</mat-icon>\n }\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }] });
|
|
5248
5249
|
}
|
|
5249
5250
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: LoadedIconComponent, decorators: [{
|
|
5250
5251
|
type: Component,
|
|
5251
|
-
args: [{ selector: 'app-loaded-icon', imports: [SharedModule], template: "<div [style.height.px]=\"size()\" [style.width.px]=\"size()\">\
|
|
5252
|
+
args: [{ selector: 'app-loaded-icon', imports: [SharedModule], template: "<div [style.height.px]=\"size()\" [style.width.px]=\"size()\">\n @if (icon() | async; as icon) {\n <div [innerHTML]=\"icon\"></div>\n } @else {\n @if (isSvgIcon(); as icon) {\n <mat-icon [svgIcon]=\"icon.id\"></mat-icon>\n } @else {\n <mat-icon>{{ defaultIcon() }}</mat-icon>\n }\n }\n</div>\n" }]
|
|
5252
5253
|
}], ctorParameters: () => [{ type: i1$6.DomSanitizer }], propDecorators: { iconRequest: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconRequest", required: true }] }], defaultIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultIcon", required: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: true }] }] } });
|
|
5253
5254
|
|
|
5254
5255
|
class IconComponent {
|
|
@@ -5262,13 +5263,13 @@ class IconComponent {
|
|
|
5262
5263
|
return !!icon && typeof icon === 'object' && Object.hasOwn(icon, 'id') ? icon : null;
|
|
5263
5264
|
}
|
|
5264
5265
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5265
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: IconComponent, isStandalone: true, selector: "app-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"shrink-0 h-6\">\
|
|
5266
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: IconComponent, isStandalone: true, selector: "app-icon", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"shrink-0 h-6\">\n @if (isAsyncIcon(); as loadedIcon) {\n <app-loaded-icon [iconRequest]=\"loadedIcon.data\" [defaultIcon]=\"loadedIcon.defaultIcon\" [size]=\"24\"/>\n }\n @if (isSvgIcon(); as svgIcon) {\n <mat-icon [svgIcon]=\"svgIcon.id\"></mat-icon>\n }\n @if (typeof icon() === 'string') {\n <mat-icon>{{ icon() }}</mat-icon>\n }\n @if (typeof icon() === 'number') {\n <span class=\"flex items-center justify-center shrink-0 min-w-5 h-5 px-1.5 rounded-full text-[11px] bg-mat-sys-primary text-mat-sys-on-primary\">{{ icon() }}</span>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: LoadedIconComponent, selector: "app-loaded-icon", inputs: ["iconRequest", "defaultIcon", "size"] }] });
|
|
5266
5267
|
}
|
|
5267
5268
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: IconComponent, decorators: [{
|
|
5268
5269
|
type: Component,
|
|
5269
5270
|
args: [{ selector: 'app-icon', imports: [
|
|
5270
5271
|
SharedModule, LoadedIconComponent, MatIcon
|
|
5271
|
-
], template: "<div class=\"shrink-0 h-6\">\
|
|
5272
|
+
], template: "<div class=\"shrink-0 h-6\">\n @if (isAsyncIcon(); as loadedIcon) {\n <app-loaded-icon [iconRequest]=\"loadedIcon.data\" [defaultIcon]=\"loadedIcon.defaultIcon\" [size]=\"24\"/>\n }\n @if (isSvgIcon(); as svgIcon) {\n <mat-icon [svgIcon]=\"svgIcon.id\"></mat-icon>\n }\n @if (typeof icon() === 'string') {\n <mat-icon>{{ icon() }}</mat-icon>\n }\n @if (typeof icon() === 'number') {\n <span class=\"flex items-center justify-center shrink-0 min-w-5 h-5 px-1.5 rounded-full text-[11px] bg-mat-sys-primary text-mat-sys-on-primary\">{{ icon() }}</span>\n }\n</div>\n" }]
|
|
5272
5273
|
}], propDecorators: { icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: true }] }] } });
|
|
5273
5274
|
|
|
5274
5275
|
class LocalSortTableComponent {
|
|
@@ -5328,7 +5329,7 @@ class LocalSortTableComponent {
|
|
|
5328
5329
|
}
|
|
5329
5330
|
}
|
|
5330
5331
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: LocalSortTableComponent, deps: [{ token: TenantPropertiesService }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5331
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: LocalSortTableComponent, isStandalone: true, selector: "app-local-sort-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, translationPrefix: { classPropertyName: "translationPrefix", publicName: "translationPrefix", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, noValuesMessage: { classPropertyName: "noValuesMessage", publicName: "noValuesMessage", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemSelected: "itemSelected" }, ngImport: i0, template: "<table>\
|
|
5332
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: LocalSortTableComponent, isStandalone: true, selector: "app-local-sort-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: true, transformFunction: null }, translationPrefix: { classPropertyName: "translationPrefix", publicName: "translationPrefix", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, noValuesMessage: { classPropertyName: "noValuesMessage", publicName: "noValuesMessage", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemSelected: "itemSelected" }, ngImport: i0, template: "<table>\n <thead>\n <tr>\n @for (column of columns(); track column.name) {\n <th class=\"!font-medium truncate\" [ngClass]=\"{'sort-field': column.shouldSort, 'cursor-pointer': column.shouldSort}\" (click)=\"column.shouldSort ? sort(column.name) : undefined\">\n <div class=\"flex flex-row items-center gap-x-2\">\n {{ (translationPrefix().toUpperCase() +column.name.toUpperCase()) | translate }}\n @if (column.shouldSort) {\n <mat-icon>{{ sortDirection === 'asc' ? 'arrow_upward' : 'arrow_downward' }}</mat-icon>\n }\n </div>\n </th>\n }\n </tr>\n </thead>\n <tbody>\n @if (loading()) {\n <div class=\"w-full h-full flex flex-col justify-center items-center\">\n <mat-spinner diameter=\"30\"></mat-spinner>\n </div>\n } @else {\n @if (displayData(); as displayData){\n @if (!noValuesMessage()) {\n @if (!sorting()) {\n <cdk-virtual-scroll-viewport [itemSize]=\"56\" class=\"viewport\">\n <tr *cdkVirtualFor=\"let element of displayData\" (click)=\"itemSelected.emit(element)\">\n @for (column of columns(); track column.name) {\n <td class=\"cursor-pointer truncate\">\n <span [matTooltip]=\"column.shouldTranslateValue ? ((translationPrefix() + element[column.name]) | translate) : element[column.name]\">\n {{ column.shouldTranslateValue ? ((translationPrefix() + element[column.name]) | translate) : element[column.name] }}\n </span>\n }\n </tr>\n </cdk-virtual-scroll-viewport>\n }\n } @else {\n <div class=\"w-full h-full flex flex-col justify-center items-center\">\n <span>{{ noValuesMessage() | translate }}</span>\n </div>\n }\n }\n }\n </tbody>\n</table>\n", styles: [":host{display:block;overflow:hidden;height:100%;width:100%}table{height:100%;width:100%;display:block}table thead{height:56px}table tbody{display:block;height:calc(100% - 56px);width:100%;overflow:hidden}table tbody tr:hover{background-color:var(--mat-sys-primary-container);color:var(--mat-sys-on-primary-container)}table th,table td{padding-left:1rem;text-align:left;vertical-align:middle;border-bottom:1px solid var(--mat-sys-outline-variant)}tr{height:56px;display:table;table-layout:fixed;width:100%}.viewport{display:block;width:100%;height:100%;overflow:auto}.sort-field mat-icon{font-size:18px;line-height:18px;height:18px;width:18px;opacity:0;transition:all ease-in .2s}.sort-field:hover mat-icon{opacity:1}\n"], dependencies: [{ kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5$2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
5332
5333
|
}
|
|
5333
5334
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: LocalSortTableComponent, decorators: [{
|
|
5334
5335
|
type: Component,
|
|
@@ -5338,7 +5339,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
5338
5339
|
CdkVirtualScrollViewport,
|
|
5339
5340
|
SharedModule,
|
|
5340
5341
|
TranslatePipe
|
|
5341
|
-
], template: "<table>\
|
|
5342
|
+
], template: "<table>\n <thead>\n <tr>\n @for (column of columns(); track column.name) {\n <th class=\"!font-medium truncate\" [ngClass]=\"{'sort-field': column.shouldSort, 'cursor-pointer': column.shouldSort}\" (click)=\"column.shouldSort ? sort(column.name) : undefined\">\n <div class=\"flex flex-row items-center gap-x-2\">\n {{ (translationPrefix().toUpperCase() +column.name.toUpperCase()) | translate }}\n @if (column.shouldSort) {\n <mat-icon>{{ sortDirection === 'asc' ? 'arrow_upward' : 'arrow_downward' }}</mat-icon>\n }\n </div>\n </th>\n }\n </tr>\n </thead>\n <tbody>\n @if (loading()) {\n <div class=\"w-full h-full flex flex-col justify-center items-center\">\n <mat-spinner diameter=\"30\"></mat-spinner>\n </div>\n } @else {\n @if (displayData(); as displayData){\n @if (!noValuesMessage()) {\n @if (!sorting()) {\n <cdk-virtual-scroll-viewport [itemSize]=\"56\" class=\"viewport\">\n <tr *cdkVirtualFor=\"let element of displayData\" (click)=\"itemSelected.emit(element)\">\n @for (column of columns(); track column.name) {\n <td class=\"cursor-pointer truncate\">\n <span [matTooltip]=\"column.shouldTranslateValue ? ((translationPrefix() + element[column.name]) | translate) : element[column.name]\">\n {{ column.shouldTranslateValue ? ((translationPrefix() + element[column.name]) | translate) : element[column.name] }}\n </span>\n }\n </tr>\n </cdk-virtual-scroll-viewport>\n }\n } @else {\n <div class=\"w-full h-full flex flex-col justify-center items-center\">\n <span>{{ noValuesMessage() | translate }}</span>\n </div>\n }\n }\n }\n </tbody>\n</table>\n", styles: [":host{display:block;overflow:hidden;height:100%;width:100%}table{height:100%;width:100%;display:block}table thead{height:56px}table tbody{display:block;height:calc(100% - 56px);width:100%;overflow:hidden}table tbody tr:hover{background-color:var(--mat-sys-primary-container);color:var(--mat-sys-on-primary-container)}table th,table td{padding-left:1rem;text-align:left;vertical-align:middle;border-bottom:1px solid var(--mat-sys-outline-variant)}tr{height:56px;display:table;table-layout:fixed;width:100%}.viewport{display:block;width:100%;height:100%;overflow:auto}.sort-field mat-icon{font-size:18px;line-height:18px;height:18px;width:18px;opacity:0;transition:all ease-in .2s}.sort-field:hover mat-icon{opacity:1}\n"] }]
|
|
5342
5343
|
}], ctorParameters: () => [{ type: TenantPropertiesService }, { type: i1$1.TranslateService }], propDecorators: { columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }], translationPrefix: [{ type: i0.Input, args: [{ isSignal: true, alias: "translationPrefix", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], noValuesMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "noValuesMessage", required: false }] }], itemSelected: [{ type: i0.Output, args: ["itemSelected"] }] } });
|
|
5343
5344
|
|
|
5344
5345
|
class MasterDetailsViewComponent {
|
|
@@ -5360,11 +5361,11 @@ class MasterDetailsViewComponent {
|
|
|
5360
5361
|
}
|
|
5361
5362
|
}, ...(ngDevMode ? [{ debugName: "width" }] : []));
|
|
5362
5363
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: MasterDetailsViewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5363
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: MasterDetailsViewComponent, isStandalone: true, selector: "app-master-details-view", inputs: { displayRatio: { classPropertyName: "displayRatio", publicName: "displayRatio", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex h-full w-full min-w-full min-h-full pt-2 overflow-hidden bg-base-color-50\">\
|
|
5364
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.0", type: MasterDetailsViewComponent, isStandalone: true, selector: "app-master-details-view", inputs: { displayRatio: { classPropertyName: "displayRatio", publicName: "displayRatio", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex h-full w-full min-w-full min-h-full pt-2 overflow-hidden bg-base-color-50\">\n <div class=\"pr-4 flex shrink-0 grow-0\" [style.width]=\"width()\" [style.max-width]=\"width()\">\n <ng-content select=\"[app-master]\"/>\n </div>\n <mat-divider [vertical]=\"true\"/>\n <div class=\"pl-4 flex shrink grow overflow-hidden\">\n <ng-content select=\"[app-details]\"/>\n </div>\n</div>\n", styles: [":host{display:block;width:100%;height:100%;overflow:hidden}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i1$7.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }] });
|
|
5364
5365
|
}
|
|
5365
5366
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: MasterDetailsViewComponent, decorators: [{
|
|
5366
5367
|
type: Component,
|
|
5367
|
-
args: [{ selector: 'app-master-details-view', imports: [SharedModule], template: "<div class=\"flex h-full w-full min-w-full min-h-full pt-2 overflow-hidden bg-base-color-50\">\
|
|
5368
|
+
args: [{ selector: 'app-master-details-view', imports: [SharedModule], template: "<div class=\"flex h-full w-full min-w-full min-h-full pt-2 overflow-hidden bg-base-color-50\">\n <div class=\"pr-4 flex shrink-0 grow-0\" [style.width]=\"width()\" [style.max-width]=\"width()\">\n <ng-content select=\"[app-master]\"/>\n </div>\n <mat-divider [vertical]=\"true\"/>\n <div class=\"pl-4 flex shrink grow overflow-hidden\">\n <ng-content select=\"[app-details]\"/>\n </div>\n</div>\n", styles: [":host{display:block;width:100%;height:100%;overflow:hidden}\n"] }]
|
|
5368
5369
|
}], propDecorators: { displayRatio: [{ type: i0.Input, args: [{ isSignal: true, alias: "displayRatio", required: false }] }] } });
|
|
5369
5370
|
|
|
5370
5371
|
class NestedListViewComponent {
|
|
@@ -5553,11 +5554,11 @@ class NestedListViewComponent {
|
|
|
5553
5554
|
return disableThresholdId && !item.idPath.includes(disableThresholdId);
|
|
5554
5555
|
}
|
|
5555
5556
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: NestedListViewComponent, deps: [{ token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
5556
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: NestedListViewComponent, isStandalone: true, selector: "app-nested-list-view", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, dataControl: { classPropertyName: "dataControl", publicName: "dataControl", isSignal: true, isRequired: true, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, disableThresholdId: { classPropertyName: "disableThresholdId", publicName: "disableThresholdId", isSignal: true, isRequired: false, transformFunction: null }, isColoredInput: { classPropertyName: "isColoredInput", publicName: "isColoredInput", isSignal: true, isRequired: false, transformFunction: null }, searchActions: { classPropertyName: "searchActions", publicName: "searchActions", isSignal: true, isRequired: false, transformFunction: null }, selectionConfirmationAction: { classPropertyName: "selectionConfirmationAction", publicName: "selectionConfirmationAction", isSignal: true, isRequired: false, transformFunction: null }, hideSearch: { classPropertyName: "hideSearch", publicName: "hideSearch", isSignal: true, isRequired: false, transformFunction: null }, rootButtonText: { classPropertyName: "rootButtonText", publicName: "rootButtonText", isSignal: true, isRequired: false, transformFunction: null }, enableDrag: { classPropertyName: "enableDrag", publicName: "enableDrag", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dragging: "dragging", itemSelected: "itemSelected" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: ["nestedListItemTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"container flex h-full w-full min-w-full min-h-full relative overflow-hidden\">\r\n <div [ngClass]=\"widthClass()\" class=\"master flex shrink-0 grow-0 min-w-0\">\r\n\r\n <!-- LISTING -->\r\n <div class=\"w-full h-full flex flex-col gap-y-2 relative\" [ngClass]=\"hideSearch() ? 'pt-2' : 'pt-1'\">\r\n\r\n <!-- HEADER -->\r\n <div class=\"flex w-full flex-row gap-x-2\">\r\n\r\n <!-- SEARCH -->\r\n @if (!hideSearch()) {\r\n <div class=\"flex shrink grow flex-row pt-1 gap-x-2 overflow-hidden\">\r\n <mat-form-field class=\"flex grow shrink small-input search-control\" (keydown.enter)=\"defaultSearchAction()?.action({parent: this.selectedItem()?.data, control: this.nameSearchControl})\" [ngClass]=\"{'colored-input': isColoredInput()}\">\r\n <mat-label>{{ 'COMMON.SEARCH_IMMEDIATE_CHILDREN' | translate }}</mat-label>\r\n <input matInput type=\"text\" [formControl]=\"nameSearchControl\">\r\n <mat-icon matSuffix>search</mat-icon>\r\n </mat-form-field>\r\n @if (defaultSearchAction(); as defaultAction) {\r\n <div [matTooltip]=\"defaultAction.disabledTooltip ? (defaultAction.disabledTooltip | translate) : ''\" [matTooltipDisabled]=\"defaultAction.disableCondition ? !defaultAction.disableCondition({control: nameSearchControl}) : true\">\r\n <button mat-mini-fab [disabled]=\"defaultAction.disableCondition ? defaultAction.disableCondition({control: nameSearchControl}) : false\" (click)=\"defaultAction.action({parent: this.selectedItem()?.data, control: this.nameSearchControl})\" [matTooltip]=\"defaultAction.name | translate\">\r\n <mat-icon [svgIcon]=\"defaultAction.icon.id\"/>\r\n </button>\r\n </div>\r\n }\r\n @for (action of otherSearchActions(); track $index) {\r\n @if (action.condition() | async) {\r\n <div [matTooltip]=\"action.disabledTooltip ? (action.disabledTooltip | translate) : ''\" [matTooltipDisabled]=\"action.disableCondition ? !action.disableCondition() : true\">\r\n <button mat-mini-fab [disabled]=\"action.disableCondition ? action.disableCondition() : false\" (click)=\"action.action()\" [matTooltip]=\"action.name | translate\">\r\n <mat-icon [svgIcon]=\"action.icon.id\"/>\r\n </button>\r\n </div>\r\n }\r\n }\r\n </div>\r\n }\r\n </div>\r\n\r\n <!-- LIST -->\r\n <div class=\"flex flex-col w-full h-full relative overflow-hidden\">\r\n\r\n <!-- BREADCRUMBS -->\r\n <div class=\"max-h-[50%] overflow-auto shrink-0\" [overflowClass]=\"'pr-4'\">\r\n @if (!loadingBreadcrumbs()) {\r\n @if (breadcrumbs(); as items) {\r\n <div class=\"flex flex-col w-full overflow-x-hidden\">\r\n @for (item of items; let i = $index; track i) {\r\n @if (selectedItem() && hasMultipleRoots() && i === 0) {\r\n <mat-card (click)=\"resetNavigation()\" class=\"mb-2 cursor-pointer regular-item hover:bg-hover-color\">\r\n <div class=\"px-3 flex flex-row items-center gap-x-2 item-card\">\r\n <div class=\"shrink-0 h-6\">\r\n <mat-icon>arrow_upward</mat-icon>\r\n </div>\r\n <span class=\"text-mat-sys-on-surface\">{{ rootButtonText() | translate: {default: rootButtonText()} }}</span>\r\n </div>\r\n </mat-card>\r\n }\r\n <ng-container [ngTemplateOutlet]=\"itemTemplate() || defaultBreadcrumbTemplate\"\r\n [ngTemplateOutletContext]=\"{$implicit: item, isSelected: selectedItem()?.id === item.id, isBreadcrumb: true, isDisabled: !!shouldDisableBreadcrumbClick(item), select: selectBreadcrumb.bind(this, item)}\">\r\n </ng-container>\r\n\r\n <!-- DEFAULT BREADCRUMB TEMPLATE -->\r\n <ng-template #defaultBreadcrumbTemplate>\r\n <mat-card class=\"mb-2 cursor-pointer\" (click)=\"selectBreadcrumb(item)\"\r\n [dndDraggable]=\"item.data\" [dndDisableDragIf]=\"!enableDrag() || !!shouldDisableBreadcrumbClick(item)\" (dndStart)=\"dragStart($event, item.data)\" (dndEnd)=\"isDragging.set(false)\"\r\n [ngClass]=\"[selectedItem()?.id === item.id ? 'selected-item' : 'regular-item hover:bg-hover-color', shouldDisableBreadcrumbClick(item) ? 'bg-disabled-color opacity-50 hover:cursor-auto pointer-events-none disabled' : '']\"\r\n [appScrollIntoView]=\"selectedItem()?.id === item.id\" [matTooltip]=\"item.name\" matTooltipPosition=\"right\">\r\n <div class=\"px-3 flex flex-row items-center justify-between gap-x-2 item-card\">\r\n <div class=\"flex flex-row grow items-center gap-x-2 overflow-hidden\">\r\n @if (item.icon; as icon) {\r\n <app-icon [icon]=\"icon\"/>\r\n }\r\n <span [ngClass]=\"[selectedItem()?.id === item.id ? 'text-mat-sys-surface-container' : 'text-mat-sys-on-surface']\" class=\"truncate\">{{ item.name }}</span>\r\n </div>\r\n @if (enableDrag() && !shouldDisableBreadcrumbClick(item)) {\r\n <mat-icon>drag_indicator</mat-icon>\r\n }\r\n </div>\r\n </mat-card>\r\n </ng-template>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n\r\n <mat-divider class=\"w-full pb-2\"/>\r\n\r\n <!-- CHILDREN -->\r\n @if (selectedItem()) {\r\n <div class=\"flex-1 overflow-auto min-h-0\" [overflowClass]=\"'pr-4'\">\r\n @if (!loadingChildren()) {\r\n @if (filteredChildren(); as items) {\r\n @if (items.length) {\r\n <div class=\"flex flex-col w-full overflow-y-auto overflow-x-hidden\">\r\n @for (item of items; track $index) {\r\n <ng-container [ngTemplateOutlet]=\"itemTemplate() || defaultChildTemplate\"\r\n [ngTemplateOutletContext]=\"{$implicit: item, isSelected: selectedItem()?.id === item.id, isBreadcrumb: false, isDisabled: false, select: selectChild.bind(this, item)}\">\r\n </ng-container>\r\n\r\n <!-- DEFAULT CHILD TEMPLATE -->\r\n <ng-template #defaultChildTemplate>\r\n <mat-card class=\"mb-2 cursor-pointer regular-item hover:bg-hover-color\" (click)=\"selectChild(item)\" [matTooltip]=\"item.name\" matTooltipPosition=\"right\"\r\n [dndDraggable]=\"item.data\" [dndDisableDragIf]=\"!enableDrag()\" (dndStart)=\"dragStart($event, item.data)\" (dndEnd)=\"isDragging.set(false)\">\r\n <div class=\"px-3 flex flex-row items-center justify-between gap-x-2 item-card\">\r\n <div class=\"flex flex-row grow items-center gap-x-2 overflow-hidden\">\r\n @if (item.icon; as icon) {\r\n <app-icon [icon]=\"icon\"/>\r\n }\r\n <span [ngClass]=\"selectedItem()?.id === item.id ? 'text-mat-sys-surface-container' : 'text-mat-sys-on-surface'\" class=\"truncate\">{{ item.name }}</span>\r\n </div>\r\n @if (enableDrag()) {\r\n <mat-icon>drag_indicator</mat-icon>\r\n }\r\n </div>\r\n </mat-card>\r\n </ng-template>\r\n }\r\n </div>\r\n } @else {\r\n <div class=\"flex flex-col grow justify-center items-center\">\r\n <ng-content select=\"[app-no-items-message]\"/>\r\n </div>\r\n }\r\n }\r\n } @else {\r\n <div class=\"flex flex-col grow justify-center items-center\">\r\n <mat-spinner diameter=\"30\"></mat-spinner>\r\n </div>\r\n }\r\n </div>\r\n }\r\n\r\n <!-- ACTIONS (bottom right of the listing) -->\r\n <div class=\"absolute bottom-0 right-0 z-10\">\r\n <ng-content select=\"[app-actions]\"/>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n @if (width() !== 'full') {\r\n <mat-divider [vertical]=\"true\" class=\"relative top-2\"/>\r\n\r\n <!-- DETAILS -->\r\n <div class=\"details flex shrink grow overflow-hidden pt-2\">\r\n <ng-content select=\"[app-details]\"/>\r\n </div>\r\n }\r\n</div>\r\n", styles: [":host{display:block;height:100%;width:100%;overflow:hidden}mat-card,.item-card{height:40px!important}.container{background-color:var(--base-color-50)}.container .master{padding-right:16px}.container .details{padding-left:16px}.selected-item{background:var(--mat-sys-primary);fill:var(--mat-sys-on-primary);color:var(--mat-sys-on-primary)}.regular-item{fill:var(--mat-sys-primary);color:var(--mat-sys-primary)}.regular-item.disabled{color:unset}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i1$4.MatMiniFabButton, selector: "button[mat-mini-fab], a[mat-mini-fab], button[matMiniFab], a[matMiniFab]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i1$7.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i5$2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ScrollIntoViewDirective, selector: "[appScrollIntoView]", inputs: ["appScrollIntoView"] }, { kind: "directive", type: OverflowClassDirective, selector: "[overflowClass]", inputs: ["overflowClass"] }, { kind: "directive", type: DndDraggableDirective, selector: "[dndDraggable]", inputs: ["dndDraggable", "dndEffectAllowed", "dndType", "dndDraggingClass", "dndDraggingSourceClass", "dndDraggableDisabledClass", "dndDragImageOffsetFunction", "dndDisableIf", "dndDisableDragIf"], outputs: ["dndStart", "dndDrag", "dndEnd", "dndMoved", "dndCopied", "dndLinked", "dndCanceled"] }, { kind: "component", type: IconComponent, selector: "app-icon", inputs: ["icon"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }] });
|
|
5557
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: NestedListViewComponent, isStandalone: true, selector: "app-nested-list-view", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, dataControl: { classPropertyName: "dataControl", publicName: "dataControl", isSignal: true, isRequired: true, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, disableThresholdId: { classPropertyName: "disableThresholdId", publicName: "disableThresholdId", isSignal: true, isRequired: false, transformFunction: null }, isColoredInput: { classPropertyName: "isColoredInput", publicName: "isColoredInput", isSignal: true, isRequired: false, transformFunction: null }, searchActions: { classPropertyName: "searchActions", publicName: "searchActions", isSignal: true, isRequired: false, transformFunction: null }, selectionConfirmationAction: { classPropertyName: "selectionConfirmationAction", publicName: "selectionConfirmationAction", isSignal: true, isRequired: false, transformFunction: null }, hideSearch: { classPropertyName: "hideSearch", publicName: "hideSearch", isSignal: true, isRequired: false, transformFunction: null }, rootButtonText: { classPropertyName: "rootButtonText", publicName: "rootButtonText", isSignal: true, isRequired: false, transformFunction: null }, enableDrag: { classPropertyName: "enableDrag", publicName: "enableDrag", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dragging: "dragging", itemSelected: "itemSelected" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: ["nestedListItemTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"container flex h-full w-full min-w-full min-h-full relative overflow-hidden\">\n <div [ngClass]=\"widthClass()\" class=\"master flex shrink-0 grow-0 min-w-0\">\n\n <!-- LISTING -->\n <div class=\"w-full h-full flex flex-col gap-y-2 relative\" [ngClass]=\"hideSearch() ? 'pt-2' : 'pt-1'\">\n\n <!-- HEADER -->\n <div class=\"flex w-full flex-row gap-x-2\">\n\n <!-- SEARCH -->\n @if (!hideSearch()) {\n <div class=\"flex shrink grow flex-row pt-1 gap-x-2 overflow-hidden\">\n <mat-form-field class=\"flex grow shrink small-input search-control\" (keydown.enter)=\"defaultSearchAction()?.action({parent: this.selectedItem()?.data, control: this.nameSearchControl})\" [ngClass]=\"{'colored-input': isColoredInput()}\">\n <mat-label>{{ 'COMMON.SEARCH_IMMEDIATE_CHILDREN' | translate }}</mat-label>\n <input matInput type=\"text\" [formControl]=\"nameSearchControl\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n @if (defaultSearchAction(); as defaultAction) {\n <div [matTooltip]=\"defaultAction.disabledTooltip ? (defaultAction.disabledTooltip | translate) : ''\" [matTooltipDisabled]=\"defaultAction.disableCondition ? !defaultAction.disableCondition({control: nameSearchControl}) : true\">\n <button mat-mini-fab [disabled]=\"defaultAction.disableCondition ? defaultAction.disableCondition({control: nameSearchControl}) : false\" (click)=\"defaultAction.action({parent: this.selectedItem()?.data, control: this.nameSearchControl})\" [matTooltip]=\"defaultAction.name | translate\">\n <mat-icon [svgIcon]=\"defaultAction.icon.id\"/>\n </button>\n </div>\n }\n @for (action of otherSearchActions(); track $index) {\n @if (action.condition() | async) {\n <div [matTooltip]=\"action.disabledTooltip ? (action.disabledTooltip | translate) : ''\" [matTooltipDisabled]=\"action.disableCondition ? !action.disableCondition() : true\">\n <button mat-mini-fab [disabled]=\"action.disableCondition ? action.disableCondition() : false\" (click)=\"action.action()\" [matTooltip]=\"action.name | translate\">\n <mat-icon [svgIcon]=\"action.icon.id\"/>\n </button>\n </div>\n }\n }\n </div>\n }\n </div>\n\n <!-- LIST -->\n <div class=\"flex flex-col w-full h-full relative overflow-hidden\">\n\n <!-- BREADCRUMBS -->\n <div class=\"max-h-[50%] overflow-auto shrink-0\" [overflowClass]=\"'pr-4'\">\n @if (!loadingBreadcrumbs()) {\n @if (breadcrumbs(); as items) {\n <div class=\"flex flex-col w-full overflow-x-hidden\">\n @for (item of items; let i = $index; track i) {\n @if (selectedItem() && hasMultipleRoots() && i === 0) {\n <mat-card (click)=\"resetNavigation()\" class=\"mb-2 cursor-pointer regular-item hover:bg-hover-color\">\n <div class=\"px-3 flex flex-row items-center gap-x-2 item-card\">\n <div class=\"shrink-0 h-6\">\n <mat-icon>arrow_upward</mat-icon>\n </div>\n <span class=\"text-mat-sys-on-surface\">{{ rootButtonText() | translate: {default: rootButtonText()} }}</span>\n </div>\n </mat-card>\n }\n <ng-container [ngTemplateOutlet]=\"itemTemplate() || defaultBreadcrumbTemplate\"\n [ngTemplateOutletContext]=\"{$implicit: item, isSelected: selectedItem()?.id === item.id, isBreadcrumb: true, isDisabled: !!shouldDisableBreadcrumbClick(item), select: selectBreadcrumb.bind(this, item)}\">\n </ng-container>\n\n <!-- DEFAULT BREADCRUMB TEMPLATE -->\n <ng-template #defaultBreadcrumbTemplate>\n <mat-card class=\"mb-2 cursor-pointer\" (click)=\"selectBreadcrumb(item)\"\n [dndDraggable]=\"item.data\" [dndDisableDragIf]=\"!enableDrag() || !!shouldDisableBreadcrumbClick(item)\" (dndStart)=\"dragStart($event, item.data)\" (dndEnd)=\"isDragging.set(false)\"\n [ngClass]=\"[selectedItem()?.id === item.id ? 'selected-item' : 'regular-item hover:bg-hover-color', shouldDisableBreadcrumbClick(item) ? 'bg-disabled-color opacity-50 hover:cursor-auto pointer-events-none disabled' : '']\"\n [appScrollIntoView]=\"selectedItem()?.id === item.id\" [matTooltip]=\"item.name\" matTooltipPosition=\"right\">\n <div class=\"px-3 flex flex-row items-center justify-between gap-x-2 item-card\">\n <div class=\"flex flex-row grow items-center gap-x-2 overflow-hidden\">\n @if (item.icon; as icon) {\n <app-icon [icon]=\"icon\"/>\n }\n <span [ngClass]=\"[selectedItem()?.id === item.id ? 'text-mat-sys-surface-container' : 'text-mat-sys-on-surface']\" class=\"truncate\">{{ item.name }}</span>\n </div>\n @if (enableDrag() && !shouldDisableBreadcrumbClick(item)) {\n <mat-icon>drag_indicator</mat-icon>\n }\n </div>\n </mat-card>\n </ng-template>\n }\n </div>\n }\n }\n </div>\n\n <mat-divider class=\"w-full pb-2\"/>\n\n <!-- CHILDREN -->\n @if (selectedItem()) {\n <div class=\"flex-1 overflow-auto min-h-0\" [overflowClass]=\"'pr-4'\">\n @if (!loadingChildren()) {\n @if (filteredChildren(); as items) {\n @if (items.length) {\n <div class=\"flex flex-col w-full overflow-y-auto overflow-x-hidden\">\n @for (item of items; track $index) {\n <ng-container [ngTemplateOutlet]=\"itemTemplate() || defaultChildTemplate\"\n [ngTemplateOutletContext]=\"{$implicit: item, isSelected: selectedItem()?.id === item.id, isBreadcrumb: false, isDisabled: false, select: selectChild.bind(this, item)}\">\n </ng-container>\n\n <!-- DEFAULT CHILD TEMPLATE -->\n <ng-template #defaultChildTemplate>\n <mat-card class=\"mb-2 cursor-pointer regular-item hover:bg-hover-color\" (click)=\"selectChild(item)\" [matTooltip]=\"item.name\" matTooltipPosition=\"right\"\n [dndDraggable]=\"item.data\" [dndDisableDragIf]=\"!enableDrag()\" (dndStart)=\"dragStart($event, item.data)\" (dndEnd)=\"isDragging.set(false)\">\n <div class=\"px-3 flex flex-row items-center justify-between gap-x-2 item-card\">\n <div class=\"flex flex-row grow items-center gap-x-2 overflow-hidden\">\n @if (item.icon; as icon) {\n <app-icon [icon]=\"icon\"/>\n }\n <span [ngClass]=\"selectedItem()?.id === item.id ? 'text-mat-sys-surface-container' : 'text-mat-sys-on-surface'\" class=\"truncate\">{{ item.name }}</span>\n </div>\n @if (enableDrag()) {\n <mat-icon>drag_indicator</mat-icon>\n }\n </div>\n </mat-card>\n </ng-template>\n }\n </div>\n } @else {\n <div class=\"flex flex-col grow justify-center items-center\">\n <ng-content select=\"[app-no-items-message]\"/>\n </div>\n }\n }\n } @else {\n <div class=\"flex flex-col grow justify-center items-center\">\n <mat-spinner diameter=\"30\"></mat-spinner>\n </div>\n }\n </div>\n }\n\n <!-- ACTIONS (bottom right of the listing) -->\n <div class=\"absolute bottom-0 right-0 z-10\">\n <ng-content select=\"[app-actions]\"/>\n </div>\n </div>\n </div>\n\n </div>\n\n @if (width() !== 'full') {\n <mat-divider [vertical]=\"true\" class=\"relative top-2\"/>\n\n <!-- DETAILS -->\n <div class=\"details flex shrink grow overflow-hidden pt-2\">\n <ng-content select=\"[app-details]\"/>\n </div>\n }\n</div>\n", styles: [":host{display:block;height:100%;width:100%;overflow:hidden}mat-card,.item-card{height:40px!important}.container{background-color:var(--base-color-50)}.container .master{padding-right:16px}.container .details{padding-left:16px}.selected-item{background:var(--mat-sys-primary);fill:var(--mat-sys-on-primary);color:var(--mat-sys-on-primary)}.regular-item{fill:var(--mat-sys-primary);color:var(--mat-sys-primary)}.regular-item.disabled{color:unset}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i1$4.MatMiniFabButton, selector: "button[mat-mini-fab], a[mat-mini-fab], button[matMiniFab], a[matMiniFab]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i1$7.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i5$2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ScrollIntoViewDirective, selector: "[appScrollIntoView]", inputs: ["appScrollIntoView"] }, { kind: "directive", type: OverflowClassDirective, selector: "[overflowClass]", inputs: ["overflowClass"] }, { kind: "directive", type: DndDraggableDirective, selector: "[dndDraggable]", inputs: ["dndDraggable", "dndEffectAllowed", "dndType", "dndDraggingClass", "dndDraggingSourceClass", "dndDraggableDisabledClass", "dndDragImageOffsetFunction", "dndDisableIf", "dndDisableDragIf"], outputs: ["dndStart", "dndDrag", "dndEnd", "dndMoved", "dndCopied", "dndLinked", "dndCanceled"] }, { kind: "component", type: IconComponent, selector: "app-icon", inputs: ["icon"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }] });
|
|
5557
5558
|
}
|
|
5558
5559
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: NestedListViewComponent, decorators: [{
|
|
5559
5560
|
type: Component,
|
|
5560
|
-
args: [{ selector: 'app-nested-list-view', imports: [SharedModule, ScrollIntoViewDirective, OverflowClassDirective, DndDraggableDirective, IconComponent], template: "<div class=\"container flex h-full w-full min-w-full min-h-full relative overflow-hidden\">\
|
|
5561
|
+
args: [{ selector: 'app-nested-list-view', imports: [SharedModule, ScrollIntoViewDirective, OverflowClassDirective, DndDraggableDirective, IconComponent], template: "<div class=\"container flex h-full w-full min-w-full min-h-full relative overflow-hidden\">\n <div [ngClass]=\"widthClass()\" class=\"master flex shrink-0 grow-0 min-w-0\">\n\n <!-- LISTING -->\n <div class=\"w-full h-full flex flex-col gap-y-2 relative\" [ngClass]=\"hideSearch() ? 'pt-2' : 'pt-1'\">\n\n <!-- HEADER -->\n <div class=\"flex w-full flex-row gap-x-2\">\n\n <!-- SEARCH -->\n @if (!hideSearch()) {\n <div class=\"flex shrink grow flex-row pt-1 gap-x-2 overflow-hidden\">\n <mat-form-field class=\"flex grow shrink small-input search-control\" (keydown.enter)=\"defaultSearchAction()?.action({parent: this.selectedItem()?.data, control: this.nameSearchControl})\" [ngClass]=\"{'colored-input': isColoredInput()}\">\n <mat-label>{{ 'COMMON.SEARCH_IMMEDIATE_CHILDREN' | translate }}</mat-label>\n <input matInput type=\"text\" [formControl]=\"nameSearchControl\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n @if (defaultSearchAction(); as defaultAction) {\n <div [matTooltip]=\"defaultAction.disabledTooltip ? (defaultAction.disabledTooltip | translate) : ''\" [matTooltipDisabled]=\"defaultAction.disableCondition ? !defaultAction.disableCondition({control: nameSearchControl}) : true\">\n <button mat-mini-fab [disabled]=\"defaultAction.disableCondition ? defaultAction.disableCondition({control: nameSearchControl}) : false\" (click)=\"defaultAction.action({parent: this.selectedItem()?.data, control: this.nameSearchControl})\" [matTooltip]=\"defaultAction.name | translate\">\n <mat-icon [svgIcon]=\"defaultAction.icon.id\"/>\n </button>\n </div>\n }\n @for (action of otherSearchActions(); track $index) {\n @if (action.condition() | async) {\n <div [matTooltip]=\"action.disabledTooltip ? (action.disabledTooltip | translate) : ''\" [matTooltipDisabled]=\"action.disableCondition ? !action.disableCondition() : true\">\n <button mat-mini-fab [disabled]=\"action.disableCondition ? action.disableCondition() : false\" (click)=\"action.action()\" [matTooltip]=\"action.name | translate\">\n <mat-icon [svgIcon]=\"action.icon.id\"/>\n </button>\n </div>\n }\n }\n </div>\n }\n </div>\n\n <!-- LIST -->\n <div class=\"flex flex-col w-full h-full relative overflow-hidden\">\n\n <!-- BREADCRUMBS -->\n <div class=\"max-h-[50%] overflow-auto shrink-0\" [overflowClass]=\"'pr-4'\">\n @if (!loadingBreadcrumbs()) {\n @if (breadcrumbs(); as items) {\n <div class=\"flex flex-col w-full overflow-x-hidden\">\n @for (item of items; let i = $index; track i) {\n @if (selectedItem() && hasMultipleRoots() && i === 0) {\n <mat-card (click)=\"resetNavigation()\" class=\"mb-2 cursor-pointer regular-item hover:bg-hover-color\">\n <div class=\"px-3 flex flex-row items-center gap-x-2 item-card\">\n <div class=\"shrink-0 h-6\">\n <mat-icon>arrow_upward</mat-icon>\n </div>\n <span class=\"text-mat-sys-on-surface\">{{ rootButtonText() | translate: {default: rootButtonText()} }}</span>\n </div>\n </mat-card>\n }\n <ng-container [ngTemplateOutlet]=\"itemTemplate() || defaultBreadcrumbTemplate\"\n [ngTemplateOutletContext]=\"{$implicit: item, isSelected: selectedItem()?.id === item.id, isBreadcrumb: true, isDisabled: !!shouldDisableBreadcrumbClick(item), select: selectBreadcrumb.bind(this, item)}\">\n </ng-container>\n\n <!-- DEFAULT BREADCRUMB TEMPLATE -->\n <ng-template #defaultBreadcrumbTemplate>\n <mat-card class=\"mb-2 cursor-pointer\" (click)=\"selectBreadcrumb(item)\"\n [dndDraggable]=\"item.data\" [dndDisableDragIf]=\"!enableDrag() || !!shouldDisableBreadcrumbClick(item)\" (dndStart)=\"dragStart($event, item.data)\" (dndEnd)=\"isDragging.set(false)\"\n [ngClass]=\"[selectedItem()?.id === item.id ? 'selected-item' : 'regular-item hover:bg-hover-color', shouldDisableBreadcrumbClick(item) ? 'bg-disabled-color opacity-50 hover:cursor-auto pointer-events-none disabled' : '']\"\n [appScrollIntoView]=\"selectedItem()?.id === item.id\" [matTooltip]=\"item.name\" matTooltipPosition=\"right\">\n <div class=\"px-3 flex flex-row items-center justify-between gap-x-2 item-card\">\n <div class=\"flex flex-row grow items-center gap-x-2 overflow-hidden\">\n @if (item.icon; as icon) {\n <app-icon [icon]=\"icon\"/>\n }\n <span [ngClass]=\"[selectedItem()?.id === item.id ? 'text-mat-sys-surface-container' : 'text-mat-sys-on-surface']\" class=\"truncate\">{{ item.name }}</span>\n </div>\n @if (enableDrag() && !shouldDisableBreadcrumbClick(item)) {\n <mat-icon>drag_indicator</mat-icon>\n }\n </div>\n </mat-card>\n </ng-template>\n }\n </div>\n }\n }\n </div>\n\n <mat-divider class=\"w-full pb-2\"/>\n\n <!-- CHILDREN -->\n @if (selectedItem()) {\n <div class=\"flex-1 overflow-auto min-h-0\" [overflowClass]=\"'pr-4'\">\n @if (!loadingChildren()) {\n @if (filteredChildren(); as items) {\n @if (items.length) {\n <div class=\"flex flex-col w-full overflow-y-auto overflow-x-hidden\">\n @for (item of items; track $index) {\n <ng-container [ngTemplateOutlet]=\"itemTemplate() || defaultChildTemplate\"\n [ngTemplateOutletContext]=\"{$implicit: item, isSelected: selectedItem()?.id === item.id, isBreadcrumb: false, isDisabled: false, select: selectChild.bind(this, item)}\">\n </ng-container>\n\n <!-- DEFAULT CHILD TEMPLATE -->\n <ng-template #defaultChildTemplate>\n <mat-card class=\"mb-2 cursor-pointer regular-item hover:bg-hover-color\" (click)=\"selectChild(item)\" [matTooltip]=\"item.name\" matTooltipPosition=\"right\"\n [dndDraggable]=\"item.data\" [dndDisableDragIf]=\"!enableDrag()\" (dndStart)=\"dragStart($event, item.data)\" (dndEnd)=\"isDragging.set(false)\">\n <div class=\"px-3 flex flex-row items-center justify-between gap-x-2 item-card\">\n <div class=\"flex flex-row grow items-center gap-x-2 overflow-hidden\">\n @if (item.icon; as icon) {\n <app-icon [icon]=\"icon\"/>\n }\n <span [ngClass]=\"selectedItem()?.id === item.id ? 'text-mat-sys-surface-container' : 'text-mat-sys-on-surface'\" class=\"truncate\">{{ item.name }}</span>\n </div>\n @if (enableDrag()) {\n <mat-icon>drag_indicator</mat-icon>\n }\n </div>\n </mat-card>\n </ng-template>\n }\n </div>\n } @else {\n <div class=\"flex flex-col grow justify-center items-center\">\n <ng-content select=\"[app-no-items-message]\"/>\n </div>\n }\n }\n } @else {\n <div class=\"flex flex-col grow justify-center items-center\">\n <mat-spinner diameter=\"30\"></mat-spinner>\n </div>\n }\n </div>\n }\n\n <!-- ACTIONS (bottom right of the listing) -->\n <div class=\"absolute bottom-0 right-0 z-10\">\n <ng-content select=\"[app-actions]\"/>\n </div>\n </div>\n </div>\n\n </div>\n\n @if (width() !== 'full') {\n <mat-divider [vertical]=\"true\" class=\"relative top-2\"/>\n\n <!-- DETAILS -->\n <div class=\"details flex shrink grow overflow-hidden pt-2\">\n <ng-content select=\"[app-details]\"/>\n </div>\n }\n</div>\n", styles: [":host{display:block;height:100%;width:100%;overflow:hidden}mat-card,.item-card{height:40px!important}.container{background-color:var(--base-color-50)}.container .master{padding-right:16px}.container .details{padding-left:16px}.selected-item{background:var(--mat-sys-primary);fill:var(--mat-sys-on-primary);color:var(--mat-sys-on-primary)}.regular-item{fill:var(--mat-sys-primary);color:var(--mat-sys-primary)}.regular-item.disabled{color:unset}\n"] }]
|
|
5561
5562
|
}], ctorParameters: () => [{ type: i0.DestroyRef }], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], dataControl: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataControl", required: true }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], disableThresholdId: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableThresholdId", required: false }] }], isColoredInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "isColoredInput", required: false }] }], searchActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchActions", required: false }] }], selectionConfirmationAction: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionConfirmationAction", required: false }] }], hideSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideSearch", required: false }] }], rootButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "rootButtonText", required: false }] }], enableDrag: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableDrag", required: false }] }], dragging: [{ type: i0.Output, args: ["dragging"] }], itemSelected: [{ type: i0.Output, args: ["itemSelected"] }], itemTemplate: [{ type: i0.ContentChild, args: ['nestedListItemTemplate', { isSignal: true }] }] } });
|
|
5562
5563
|
|
|
5563
5564
|
class NestedListDataControl {
|
|
@@ -5615,11 +5616,11 @@ class PdfViewerComponent {
|
|
|
5615
5616
|
this.sanitizer = sanitizer;
|
|
5616
5617
|
}
|
|
5617
5618
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: PdfViewerComponent, deps: [{ token: i1$6.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
|
|
5618
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: PdfViewerComponent, isStandalone: true, selector: "app-pdf-viewer", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@if (safeSrc()) {\
|
|
5619
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: PdfViewerComponent, isStandalone: true, selector: "app-pdf-viewer", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "@if (safeSrc()) {\n <iframe [src]=\"safeSrc()\" frameborder=\"0\" class=\"w-full h-full\"></iframe>\n}", styles: [""] });
|
|
5619
5620
|
}
|
|
5620
5621
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: PdfViewerComponent, decorators: [{
|
|
5621
5622
|
type: Component,
|
|
5622
|
-
args: [{ selector: 'app-pdf-viewer', imports: [], template: "@if (safeSrc()) {\
|
|
5623
|
+
args: [{ selector: 'app-pdf-viewer', imports: [], template: "@if (safeSrc()) {\n <iframe [src]=\"safeSrc()\" frameborder=\"0\" class=\"w-full h-full\"></iframe>\n}" }]
|
|
5623
5624
|
}], ctorParameters: () => [{ type: i1$6.DomSanitizer }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }] } });
|
|
5624
5625
|
|
|
5625
5626
|
class StandardListViewComponent {
|
|
@@ -5748,11 +5749,11 @@ class StandardListViewComponent {
|
|
|
5748
5749
|
});
|
|
5749
5750
|
}
|
|
5750
5751
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: StandardListViewComponent, deps: [{ token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
5751
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: StandardListViewComponent, isStandalone: true, selector: "app-standard-list-view", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, dataControl: { classPropertyName: "dataControl", publicName: "dataControl", isSignal: true, isRequired: true, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, isColoredInput: { classPropertyName: "isColoredInput", publicName: "isColoredInput", isSignal: true, isRequired: false, transformFunction: null }, hideSearch: { classPropertyName: "hideSearch", publicName: "hideSearch", isSignal: true, isRequired: false, transformFunction: null }, hideDetails: { classPropertyName: "hideDetails", publicName: "hideDetails", isSignal: true, isRequired: false, transformFunction: null }, hidePadding: { classPropertyName: "hidePadding", publicName: "hidePadding", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemSelected: "itemSelected" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: ["standardListItemTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"container flex h-full w-full min-w-full min-h-full relative overflow-hidden {{hidePadding() ? 'pt-0' : 'pt-2'}}\">\
|
|
5752
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: StandardListViewComponent, isStandalone: true, selector: "app-standard-list-view", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, transformFunction: null }, dataControl: { classPropertyName: "dataControl", publicName: "dataControl", isSignal: true, isRequired: true, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, isColoredInput: { classPropertyName: "isColoredInput", publicName: "isColoredInput", isSignal: true, isRequired: false, transformFunction: null }, hideSearch: { classPropertyName: "hideSearch", publicName: "hideSearch", isSignal: true, isRequired: false, transformFunction: null }, hideDetails: { classPropertyName: "hideDetails", publicName: "hideDetails", isSignal: true, isRequired: false, transformFunction: null }, hidePadding: { classPropertyName: "hidePadding", publicName: "hidePadding", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemSelected: "itemSelected" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: ["standardListItemTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"container flex h-full w-full min-w-full min-h-full relative overflow-hidden {{hidePadding() ? 'pt-0' : 'pt-2'}}\">\n <div [ngClass]=\"width()\" class=\"master flex shrink-0 grow-0 min-w-0\">\n\n <!-- LISTING -->\n <div class=\"w-full h-full flex flex-col gap-y-2 relative\">\n\n <!-- SEARCH -->\n @if (!hideSearch()) {\n <mat-form-field class=\"w-full small-input\" [ngClass]=\"{'colored-input': isColoredInput()}\">\n <mat-label>{{ 'COMMON.SEARCH' | translate }}</mat-label>\n <input matInput type=\"text\" [formControl]=\"nameSearchControl\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n }\n\n <!-- LIST -->\n <div class=\"flex flex-col w-full h-full relative overflow-hidden\">\n @if (!loadingData()) {\n @if (filteredItems(); as items) {\n @if (items.length) {\n <div class=\"flex flex-col w-full grow shrink overflow-y-auto overflow-x-hidden\" [overflowClass]=\"'pr-4'\">\n @for (item of items; track $index) {\n <ng-container [ngTemplateOutlet]=\"itemTemplate() || defaultTemplate\" [ngTemplateOutletContext]=\"{$implicit: item, selectedItem: selectedItem(), selectItem: selectItem.bind(this)}\"/>\n\n <!--DEFAULT TEMPLATE-->\n <ng-template #defaultTemplate>\n <mat-card class=\"mb-2 cursor-pointer\" (click)=\"selectItem(item)\"\n [class]=\"selectedItem()?.id === item.id ? 'selected-item' : 'regular-item hover:bg-hover-color'\"\n [appScrollIntoView]=\"selectedItem()?.id === item.id\"\n [matTooltip]=\"item.name\" matTooltipPosition=\"right\">\n <div class=\"px-3 flex flex-row items-center gap-x-2 item-card\">\n @if (item.icon; as icon) {\n <app-icon [icon]=\"icon\"/>\n }\n <span [ngClass]=\"selectedItem()?.id === item.id ? 'text-mat-sys-surface-container' : 'text-mat-sys-on-surface'\" class=\"truncate flex-1\">{{ item.name }}</span>\n @if (item.rightIcon; as icon) {\n <app-icon [icon]=\"icon\"/>\n }\n </div>\n </mat-card>\n </ng-template>\n }\n\n <!-- Load more -->\n @if (this.dataSource().isPaged && !this.dataSource().isLastPage) {\n <mat-card class=\"mb-2 cursor-pointer regular-item hover:bg-hover-color\" (click)=\"loadMore()\">\n <div class=\"px-3 flex flex-row justify-center items-center gap-x-2 item-card\">\n @if (loadingPage()) {\n <mat-spinner diameter=\"30\"></mat-spinner>\n } @else {\n <span class=\"text-mat-sys-on-surface\">{{ 'COMMON.LOAD_MORE' | translate }}</span>\n }\n </div>\n </mat-card>\n }\n </div>\n } @else {\n <div class=\"flex flex-col grow justify-center items-center\">\n <ng-content select=\"[app-no-items-message]\"></ng-content>\n </div>\n }\n }\n } @else {\n <div class=\"flex flex-col grow justify-center items-center\">\n <mat-spinner diameter=\"30\"></mat-spinner>\n </div>\n }\n\n <!-- ACTIONS (bottom right of the listing) -->\n <div class=\"absolute bottom-0 right-0 z-10\">\n <ng-content select=\"[app-actions]\"/>\n </div>\n </div>\n </div>\n\n </div>\n\n @if (!hideDetails()) {\n <mat-divider [vertical]=\"true\"/>\n\n <!-- DETAILS -->\n <div class=\"details flex shrink grow overflow-hidden\">\n <ng-content select=\"[app-details]\"/>\n </div>\n }\n</div>\n", styles: [":host{display:block;height:100%;width:100%;overflow:hidden}mat-card,.item-card{height:40px!important}.container{background-color:var(--base-color-50)}.container .master{padding-right:16px}.container .details{padding-left:16px}.selected-item{background:var(--mat-sys-primary);fill:var(--mat-sys-on-primary);color:var(--mat-sys-on-primary)}.regular-item{fill:var(--mat-sys-primary);color:var(--mat-sys-primary)}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i1$7.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i5$2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: OverflowClassDirective, selector: "[overflowClass]", inputs: ["overflowClass"] }, { kind: "directive", type: ScrollIntoViewDirective, selector: "[appScrollIntoView]", inputs: ["appScrollIntoView"] }, { kind: "component", type: IconComponent, selector: "app-icon", inputs: ["icon"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
5752
5753
|
}
|
|
5753
5754
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: StandardListViewComponent, decorators: [{
|
|
5754
5755
|
type: Component,
|
|
5755
|
-
args: [{ selector: 'app-standard-list-view', imports: [SharedModule, OverflowClassDirective, ScrollIntoViewDirective, IconComponent], template: "<div class=\"container flex h-full w-full min-w-full min-h-full relative overflow-hidden {{hidePadding() ? 'pt-0' : 'pt-2'}}\">\
|
|
5756
|
+
args: [{ selector: 'app-standard-list-view', imports: [SharedModule, OverflowClassDirective, ScrollIntoViewDirective, IconComponent], template: "<div class=\"container flex h-full w-full min-w-full min-h-full relative overflow-hidden {{hidePadding() ? 'pt-0' : 'pt-2'}}\">\n <div [ngClass]=\"width()\" class=\"master flex shrink-0 grow-0 min-w-0\">\n\n <!-- LISTING -->\n <div class=\"w-full h-full flex flex-col gap-y-2 relative\">\n\n <!-- SEARCH -->\n @if (!hideSearch()) {\n <mat-form-field class=\"w-full small-input\" [ngClass]=\"{'colored-input': isColoredInput()}\">\n <mat-label>{{ 'COMMON.SEARCH' | translate }}</mat-label>\n <input matInput type=\"text\" [formControl]=\"nameSearchControl\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n }\n\n <!-- LIST -->\n <div class=\"flex flex-col w-full h-full relative overflow-hidden\">\n @if (!loadingData()) {\n @if (filteredItems(); as items) {\n @if (items.length) {\n <div class=\"flex flex-col w-full grow shrink overflow-y-auto overflow-x-hidden\" [overflowClass]=\"'pr-4'\">\n @for (item of items; track $index) {\n <ng-container [ngTemplateOutlet]=\"itemTemplate() || defaultTemplate\" [ngTemplateOutletContext]=\"{$implicit: item, selectedItem: selectedItem(), selectItem: selectItem.bind(this)}\"/>\n\n <!--DEFAULT TEMPLATE-->\n <ng-template #defaultTemplate>\n <mat-card class=\"mb-2 cursor-pointer\" (click)=\"selectItem(item)\"\n [class]=\"selectedItem()?.id === item.id ? 'selected-item' : 'regular-item hover:bg-hover-color'\"\n [appScrollIntoView]=\"selectedItem()?.id === item.id\"\n [matTooltip]=\"item.name\" matTooltipPosition=\"right\">\n <div class=\"px-3 flex flex-row items-center gap-x-2 item-card\">\n @if (item.icon; as icon) {\n <app-icon [icon]=\"icon\"/>\n }\n <span [ngClass]=\"selectedItem()?.id === item.id ? 'text-mat-sys-surface-container' : 'text-mat-sys-on-surface'\" class=\"truncate flex-1\">{{ item.name }}</span>\n @if (item.rightIcon; as icon) {\n <app-icon [icon]=\"icon\"/>\n }\n </div>\n </mat-card>\n </ng-template>\n }\n\n <!-- Load more -->\n @if (this.dataSource().isPaged && !this.dataSource().isLastPage) {\n <mat-card class=\"mb-2 cursor-pointer regular-item hover:bg-hover-color\" (click)=\"loadMore()\">\n <div class=\"px-3 flex flex-row justify-center items-center gap-x-2 item-card\">\n @if (loadingPage()) {\n <mat-spinner diameter=\"30\"></mat-spinner>\n } @else {\n <span class=\"text-mat-sys-on-surface\">{{ 'COMMON.LOAD_MORE' | translate }}</span>\n }\n </div>\n </mat-card>\n }\n </div>\n } @else {\n <div class=\"flex flex-col grow justify-center items-center\">\n <ng-content select=\"[app-no-items-message]\"></ng-content>\n </div>\n }\n }\n } @else {\n <div class=\"flex flex-col grow justify-center items-center\">\n <mat-spinner diameter=\"30\"></mat-spinner>\n </div>\n }\n\n <!-- ACTIONS (bottom right of the listing) -->\n <div class=\"absolute bottom-0 right-0 z-10\">\n <ng-content select=\"[app-actions]\"/>\n </div>\n </div>\n </div>\n\n </div>\n\n @if (!hideDetails()) {\n <mat-divider [vertical]=\"true\"/>\n\n <!-- DETAILS -->\n <div class=\"details flex shrink grow overflow-hidden\">\n <ng-content select=\"[app-details]\"/>\n </div>\n }\n</div>\n", styles: [":host{display:block;height:100%;width:100%;overflow:hidden}mat-card,.item-card{height:40px!important}.container{background-color:var(--base-color-50)}.container .master{padding-right:16px}.container .details{padding-left:16px}.selected-item{background:var(--mat-sys-primary);fill:var(--mat-sys-on-primary);color:var(--mat-sys-on-primary)}.regular-item{fill:var(--mat-sys-primary);color:var(--mat-sys-primary)}\n"] }]
|
|
5756
5757
|
}], ctorParameters: () => [{ type: i0.DestroyRef }], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], dataControl: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataControl", required: true }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], isColoredInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "isColoredInput", required: false }] }], hideSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideSearch", required: false }] }], hideDetails: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideDetails", required: false }] }], hidePadding: [{ type: i0.Input, args: [{ isSignal: true, alias: "hidePadding", required: false }] }], itemSelected: [{ type: i0.Output, args: ["itemSelected"] }], itemTemplate: [{ type: i0.ContentChild, args: ['standardListItemTemplate', { isSignal: true }] }] } });
|
|
5757
5758
|
|
|
5758
5759
|
class StandardListDataControl {
|
|
@@ -5838,11 +5839,11 @@ class TabulatedChipViewComponent {
|
|
|
5838
5839
|
}
|
|
5839
5840
|
}
|
|
5840
5841
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: TabulatedChipViewComponent, deps: [{ token: i1$2.Router }, { token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
|
|
5841
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: TabulatedChipViewComponent, isStandalone: true, selector: "app-tabulated-chip-view", inputs: { tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: true, transformFunction: null }, queryParamHandling: { classPropertyName: "queryParamHandling", publicName: "queryParamHandling", isSignal: true, isRequired: false, transformFunction: null }, saveLastActiveTab: { classPropertyName: "saveLastActiveTab", publicName: "saveLastActiveTab", isSignal: true, isRequired: false, transformFunction: null }, navBarLayoutClasses: { classPropertyName: "navBarLayoutClasses", publicName: "navBarLayoutClasses", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-auto flex-col overflow-hidden tabulated-view-container\">\
|
|
5842
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: TabulatedChipViewComponent, isStandalone: true, selector: "app-tabulated-chip-view", inputs: { tabs: { classPropertyName: "tabs", publicName: "tabs", isSignal: true, isRequired: true, transformFunction: null }, queryParamHandling: { classPropertyName: "queryParamHandling", publicName: "queryParamHandling", isSignal: true, isRequired: false, transformFunction: null }, saveLastActiveTab: { classPropertyName: "saveLastActiveTab", publicName: "saveLastActiveTab", isSignal: true, isRequired: false, transformFunction: null }, navBarLayoutClasses: { classPropertyName: "navBarLayoutClasses", publicName: "navBarLayoutClasses", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"flex flex-auto flex-col overflow-hidden tabulated-view-container\">\n <nav mat-tab-nav-bar [mat-stretch-tabs]=\"false\" [tabPanel]=\"tabPanel\" class=\"navigation\" [ngClass]=\"navBarLayoutClasses()\">\n @for (tab of tabs(); track $index) {\n @if (!tab.condition || (tab.condition | async)) {\n <div\n mat-tab-link\n [active]=\"isActive(tab.route)\"\n (click)=\"navigate(tab.route)\"\n [matTooltip]=\"tab.tooltip ? (tab.tooltip | translate) : null\"\n [ngClass]=\"{ 'bg-mat-sys-primary': isActive(tab.route), 'active': isActive(tab.route) }\"\n class=\"rounded mr-2 navigation-tab\"\n [attr.data-test]=\"tab.name + '_tab'\"\n >\n @if (tab.icon) {\n <mat-icon>{{ tab.icon }}</mat-icon>\n }\n <span [ngClass]=\"isActive(tab.route) ?'text-mat-sys-surface-container' : 'text-mat-sys-primary'\">{{ tab.name | translate }}</span>\n </div>\n }\n }\n </nav>\n <mat-tab-nav-panel #tabPanel class=\"flex flex-auto flex-col overflow-hidden\">\n <router-outlet/>\n </mat-tab-nav-panel>\n</div>\n", styles: [":host{display:flex;height:100%;width:100%;max-height:100%;max-width:100%;box-sizing:border-box;--mat-tab-active-indicator-color: transparent;--mat-tab-active-focus-indicator-color: transparent;--mat-tab-active-hover-indicator-color: transparent;--mat-tab-active-ripple-color: transparent;--mat-tab-inactive-ripple-color: transparent;--mat-tab-disabled-ripple-color: transparent;--mat-tab-active-indicator-height: 0;--mat-tab-divider-height: 0px;--mat-tab-container-height: 40px}.navigation{max-width:100%}.navigation-tab{border:1px solid var(--mat-sys-outline-variant);border-radius:10px;padding:0 1rem;height:2.5rem;box-sizing:border-box}.navigation-tab.active{border:none}.navigation-tab:hover{box-shadow:inset 0 0 0 200px #fff3}.navigation-tab:hover mat-icon,.navigation-tab:hover span{opacity:.8}:host-context(.alt-theme) .navigation-tab:hover{box-shadow:inset 0 0 0 200px #0003}:host-context(.alt-theme) .navigation-tab:hover mat-icon,:host-context(.alt-theme) .navigation-tab:hover span{opacity:.6}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i3$1.MatTabNav, selector: "[mat-tab-nav-bar]", inputs: ["fitInkBarToContent", "mat-stretch-tabs", "animationDuration", "backgroundColor", "disableRipple", "color", "tabPanel"], exportAs: ["matTabNavBar", "matTabNav"] }, { kind: "component", type: i3$1.MatTabNavPanel, selector: "mat-tab-nav-panel", inputs: ["id"], exportAs: ["matTabNavPanel"] }, { kind: "component", type: i3$1.MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: ["active", "disabled", "disableRipple", "tabIndex", "id"], exportAs: ["matTabLink"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }] });
|
|
5842
5843
|
}
|
|
5843
5844
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: TabulatedChipViewComponent, decorators: [{
|
|
5844
5845
|
type: Component,
|
|
5845
|
-
args: [{ selector: 'app-tabulated-chip-view', imports: [SharedModule], template: "<div class=\"flex flex-auto flex-col overflow-hidden tabulated-view-container\">\
|
|
5846
|
+
args: [{ selector: 'app-tabulated-chip-view', imports: [SharedModule], template: "<div class=\"flex flex-auto flex-col overflow-hidden tabulated-view-container\">\n <nav mat-tab-nav-bar [mat-stretch-tabs]=\"false\" [tabPanel]=\"tabPanel\" class=\"navigation\" [ngClass]=\"navBarLayoutClasses()\">\n @for (tab of tabs(); track $index) {\n @if (!tab.condition || (tab.condition | async)) {\n <div\n mat-tab-link\n [active]=\"isActive(tab.route)\"\n (click)=\"navigate(tab.route)\"\n [matTooltip]=\"tab.tooltip ? (tab.tooltip | translate) : null\"\n [ngClass]=\"{ 'bg-mat-sys-primary': isActive(tab.route), 'active': isActive(tab.route) }\"\n class=\"rounded mr-2 navigation-tab\"\n [attr.data-test]=\"tab.name + '_tab'\"\n >\n @if (tab.icon) {\n <mat-icon>{{ tab.icon }}</mat-icon>\n }\n <span [ngClass]=\"isActive(tab.route) ?'text-mat-sys-surface-container' : 'text-mat-sys-primary'\">{{ tab.name | translate }}</span>\n </div>\n }\n }\n </nav>\n <mat-tab-nav-panel #tabPanel class=\"flex flex-auto flex-col overflow-hidden\">\n <router-outlet/>\n </mat-tab-nav-panel>\n</div>\n", styles: [":host{display:flex;height:100%;width:100%;max-height:100%;max-width:100%;box-sizing:border-box;--mat-tab-active-indicator-color: transparent;--mat-tab-active-focus-indicator-color: transparent;--mat-tab-active-hover-indicator-color: transparent;--mat-tab-active-ripple-color: transparent;--mat-tab-inactive-ripple-color: transparent;--mat-tab-disabled-ripple-color: transparent;--mat-tab-active-indicator-height: 0;--mat-tab-divider-height: 0px;--mat-tab-container-height: 40px}.navigation{max-width:100%}.navigation-tab{border:1px solid var(--mat-sys-outline-variant);border-radius:10px;padding:0 1rem;height:2.5rem;box-sizing:border-box}.navigation-tab.active{border:none}.navigation-tab:hover{box-shadow:inset 0 0 0 200px #fff3}.navigation-tab:hover mat-icon,.navigation-tab:hover span{opacity:.8}:host-context(.alt-theme) .navigation-tab:hover{box-shadow:inset 0 0 0 200px #0003}:host-context(.alt-theme) .navigation-tab:hover mat-icon,:host-context(.alt-theme) .navigation-tab:hover span{opacity:.6}\n"] }]
|
|
5846
5847
|
}], ctorParameters: () => [{ type: i1$2.Router }, { type: i1$2.ActivatedRoute }], propDecorators: { tabs: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabs", required: true }] }], queryParamHandling: [{ type: i0.Input, args: [{ isSignal: true, alias: "queryParamHandling", required: false }] }], saveLastActiveTab: [{ type: i0.Input, args: [{ isSignal: true, alias: "saveLastActiveTab", required: false }] }], navBarLayoutClasses: [{ type: i0.Input, args: [{ isSignal: true, alias: "navBarLayoutClasses", required: false }] }] } });
|
|
5847
5848
|
|
|
5848
5849
|
class TabulatedViewComponent {
|
|
@@ -5862,11 +5863,11 @@ class TabulatedViewComponent {
|
|
|
5862
5863
|
}
|
|
5863
5864
|
}
|
|
5864
5865
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: TabulatedViewComponent, deps: [{ token: i1$2.Router }, { token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
|
|
5865
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: TabulatedViewComponent, isStandalone: true, selector: "app-tabulated-view", inputs: { tabs: "tabs" }, ngImport: i0, template: "<div class=\"flex flex-auto flex-col overflow-hidden\">\
|
|
5866
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: TabulatedViewComponent, isStandalone: true, selector: "app-tabulated-view", inputs: { tabs: "tabs" }, ngImport: i0, template: "<div class=\"flex flex-auto flex-col overflow-hidden\">\n <nav mat-tab-nav-bar [mat-stretch-tabs]=\"false\" [tabPanel]=\"tabPanel\" class=\"navigation\">\n <div\n *ngFor=\"let tab of tabs\"\n mat-tab-link\n [active]=\"isActive(tab.route)\"\n (click)=\"navigate(tab.route)\"\n [matTooltip]=\"tab.tooltip ? (tab.tooltip | translate) : null\"\n [attr.data-test]=\"tab.name + '_tab'\"\n >\n <mat-icon *ngIf=\"tab.icon\">\n {{ tab.icon }}\n </mat-icon>\n {{ tab.name | translate }}\n </div>\n </nav>\n <mat-tab-nav-panel #tabPanel class=\"flex flex-auto flex-col overflow-hidden\">\n <router-outlet></router-outlet>\n </mat-tab-nav-panel>\n</div>\n", styles: [":host{display:flex;height:100%;width:100%;max-height:100%;max-width:100%;box-sizing:border-box}.navigation{border-bottom:1px solid rgba(0,0,0,.12);max-width:100%}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i3$1.MatTabNav, selector: "[mat-tab-nav-bar]", inputs: ["fitInkBarToContent", "mat-stretch-tabs", "animationDuration", "backgroundColor", "disableRipple", "color", "tabPanel"], exportAs: ["matTabNavBar", "matTabNav"] }, { kind: "component", type: i3$1.MatTabNavPanel, selector: "mat-tab-nav-panel", inputs: ["id"], exportAs: ["matTabNavPanel"] }, { kind: "component", type: i3$1.MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: ["active", "disabled", "disableRipple", "tabIndex", "id"], exportAs: ["matTabLink"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
5866
5867
|
}
|
|
5867
5868
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: TabulatedViewComponent, decorators: [{
|
|
5868
5869
|
type: Component,
|
|
5869
|
-
args: [{ selector: 'app-tabulated-view', imports: [SharedModule], template: "<div class=\"flex flex-auto flex-col overflow-hidden\">\
|
|
5870
|
+
args: [{ selector: 'app-tabulated-view', imports: [SharedModule], template: "<div class=\"flex flex-auto flex-col overflow-hidden\">\n <nav mat-tab-nav-bar [mat-stretch-tabs]=\"false\" [tabPanel]=\"tabPanel\" class=\"navigation\">\n <div\n *ngFor=\"let tab of tabs\"\n mat-tab-link\n [active]=\"isActive(tab.route)\"\n (click)=\"navigate(tab.route)\"\n [matTooltip]=\"tab.tooltip ? (tab.tooltip | translate) : null\"\n [attr.data-test]=\"tab.name + '_tab'\"\n >\n <mat-icon *ngIf=\"tab.icon\">\n {{ tab.icon }}\n </mat-icon>\n {{ tab.name | translate }}\n </div>\n </nav>\n <mat-tab-nav-panel #tabPanel class=\"flex flex-auto flex-col overflow-hidden\">\n <router-outlet></router-outlet>\n </mat-tab-nav-panel>\n</div>\n", styles: [":host{display:flex;height:100%;width:100%;max-height:100%;max-width:100%;box-sizing:border-box}.navigation{border-bottom:1px solid rgba(0,0,0,.12);max-width:100%}\n"] }]
|
|
5870
5871
|
}], ctorParameters: () => [{ type: i1$2.Router }, { type: i1$2.ActivatedRoute }], propDecorators: { tabs: [{
|
|
5871
5872
|
type: Input,
|
|
5872
5873
|
args: [{ required: true }]
|
|
@@ -5882,11 +5883,11 @@ class TreeNodeComponent {
|
|
|
5882
5883
|
this.nodeSelected.emit(node);
|
|
5883
5884
|
}
|
|
5884
5885
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: TreeNodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5885
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: TreeNodeComponent, isStandalone: true, selector: "app-tree-node", inputs: { node: { classPropertyName: "node", publicName: "node", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { nodeSelected: "nodeSelected" }, ngImport: i0, template: "<div class=\"w-full flex flex-col\">\
|
|
5886
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: TreeNodeComponent, isStandalone: true, selector: "app-tree-node", inputs: { node: { classPropertyName: "node", publicName: "node", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { nodeSelected: "nodeSelected" }, ngImport: i0, template: "<div class=\"w-full flex flex-col\">\n <!-- ROW -->\n <div class=\"w-full h-10 flex flex-row items-center\">\n\n <!-- ARROWS -->\n @if (node().canHaveChildren) {\n @if (node().open) {\n <button mat-icon-button class=\"scale-80\" (click)=\"toggle(node())\">\n <mat-icon>keyboard_arrow_down</mat-icon>\n </button>\n } @else {\n <button mat-icon-button class=\"scale-80\" [disabled]=\"!node().hasChildren\" (click)=\"toggle(node())\">\n <mat-icon>keyboard_arrow_right</mat-icon>\n </button>\n }\n } @else {\n <div class=\"w-12 h-12\"> </div>\n }\n\n <!-- ICON AND TEXT -->\n <div class=\"flex flex-row items-center cursor-pointer\" (click)=\"selectNode(node())\">\n <mat-icon [ngClass]=\"node().selected ? 'text-mat-sys-tertiary' : 'text-mat-sys-primary'\">{{ node().icon }}</mat-icon>\n <div class=\"pl-2\" [ngClass]=\"{ 'text-mat-sys-tertiary' : node().selected }\">{{ node().name }}</div>\n </div>\n </div>\n\n <!-- Children -->\n @if (node().open) {\n <div class=\"w-full flex flex-col pl-9\">\n @if (node().children | async; as children) {\n @for (child of children; track $index) {\n <app-tree-node [node]=\"child\" (nodeSelected)=\"selectNode($event)\"/>\n }\n }\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: TreeNodeComponent, selector: "app-tree-node", inputs: ["node"], outputs: ["nodeSelected"] }, { kind: "ngmodule", type: SharedModule }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i9.AsyncPipe, name: "async" }] });
|
|
5886
5887
|
}
|
|
5887
5888
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: TreeNodeComponent, decorators: [{
|
|
5888
5889
|
type: Component,
|
|
5889
|
-
args: [{ selector: 'app-tree-node', imports: [SharedModule], template: "<div class=\"w-full flex flex-col\">\
|
|
5890
|
+
args: [{ selector: 'app-tree-node', imports: [SharedModule], template: "<div class=\"w-full flex flex-col\">\n <!-- ROW -->\n <div class=\"w-full h-10 flex flex-row items-center\">\n\n <!-- ARROWS -->\n @if (node().canHaveChildren) {\n @if (node().open) {\n <button mat-icon-button class=\"scale-80\" (click)=\"toggle(node())\">\n <mat-icon>keyboard_arrow_down</mat-icon>\n </button>\n } @else {\n <button mat-icon-button class=\"scale-80\" [disabled]=\"!node().hasChildren\" (click)=\"toggle(node())\">\n <mat-icon>keyboard_arrow_right</mat-icon>\n </button>\n }\n } @else {\n <div class=\"w-12 h-12\"> </div>\n }\n\n <!-- ICON AND TEXT -->\n <div class=\"flex flex-row items-center cursor-pointer\" (click)=\"selectNode(node())\">\n <mat-icon [ngClass]=\"node().selected ? 'text-mat-sys-tertiary' : 'text-mat-sys-primary'\">{{ node().icon }}</mat-icon>\n <div class=\"pl-2\" [ngClass]=\"{ 'text-mat-sys-tertiary' : node().selected }\">{{ node().name }}</div>\n </div>\n </div>\n\n <!-- Children -->\n @if (node().open) {\n <div class=\"w-full flex flex-col pl-9\">\n @if (node().children | async; as children) {\n @for (child of children; track $index) {\n <app-tree-node [node]=\"child\" (nodeSelected)=\"selectNode($event)\"/>\n }\n }\n </div>\n }\n</div>\n" }]
|
|
5890
5891
|
}], propDecorators: { node: [{ type: i0.Input, args: [{ isSignal: true, alias: "node", required: true }] }], nodeSelected: [{ type: i0.Output, args: ["nodeSelected"] }] } });
|
|
5891
5892
|
|
|
5892
5893
|
class TreeComponent {
|
|
@@ -5936,11 +5937,11 @@ class TreeComponent {
|
|
|
5936
5937
|
this.selectedNode.selected = true;
|
|
5937
5938
|
}
|
|
5938
5939
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: TreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5939
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: TreeComponent, isStandalone: true, selector: "app-tree", inputs: { roots: { classPropertyName: "roots", publicName: "roots", isSignal: true, isRequired: true, transformFunction: null }, guidPath: { classPropertyName: "guidPath", publicName: "guidPath", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { nodeSelected: "nodeSelected" }, ngImport: i0, template: "<div class=\"h-full w-full flex flex-col\">\
|
|
5940
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: TreeComponent, isStandalone: true, selector: "app-tree", inputs: { roots: { classPropertyName: "roots", publicName: "roots", isSignal: true, isRequired: true, transformFunction: null }, guidPath: { classPropertyName: "guidPath", publicName: "guidPath", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { nodeSelected: "nodeSelected" }, ngImport: i0, template: "<div class=\"h-full w-full flex flex-col\">\n @for (node of roots(); track $index) {\n <app-tree-node [node]=\"node\" (nodeSelected)=\"selectNode($event)\"/>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: TreeNodeComponent, selector: "app-tree-node", inputs: ["node"], outputs: ["nodeSelected"] }] });
|
|
5940
5941
|
}
|
|
5941
5942
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: TreeComponent, decorators: [{
|
|
5942
5943
|
type: Component,
|
|
5943
|
-
args: [{ selector: 'app-tree', imports: [TreeNodeComponent], template: "<div class=\"h-full w-full flex flex-col\">\
|
|
5944
|
+
args: [{ selector: 'app-tree', imports: [TreeNodeComponent], template: "<div class=\"h-full w-full flex flex-col\">\n @for (node of roots(); track $index) {\n <app-tree-node [node]=\"node\" (nodeSelected)=\"selectNode($event)\"/>\n }\n</div>\n" }]
|
|
5944
5945
|
}], ctorParameters: () => [], propDecorators: { roots: [{ type: i0.Input, args: [{ isSignal: true, alias: "roots", required: true }] }], guidPath: [{ type: i0.Input, args: [{ isSignal: true, alias: "guidPath", required: true }] }], nodeSelected: [{ type: i0.Output, args: ["nodeSelected"] }] } });
|
|
5945
5946
|
|
|
5946
5947
|
class ValueDisplayComponent {
|
|
@@ -5957,11 +5958,11 @@ class ValueDisplayComponent {
|
|
|
5957
5958
|
return vector.replaceAll(',', ', ');
|
|
5958
5959
|
}
|
|
5959
5960
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueDisplayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5960
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ValueDisplayComponent, isStandalone: true, selector: "app-value-display", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: true, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (value(); as value) {\
|
|
5961
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: ValueDisplayComponent, isStandalone: true, selector: "app-value-display", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: true, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@if (value(); as value) {\n @switch (type()) {\n @case (DataType.BOOLEAN) {\n <mat-icon>{{ value === 'true' ? 'check' : 'close' }}</mat-icon>\n }\n @case (DataType.COLOR) {\n <div class=\"color-circle\" [style.background-color]=\"value\"></div>\n }\n @case (DataType.DATE) {\n <div class=\"truncate\" matTooltip=\"{{ getNumber(value) | simpleDateTime }}\">{{ getNumber(value) | simpleDateTime }}</div>\n }\n @case (DataType.DURATION) {\n {{ getNumber(value) | duration }}\n }\n @case (DataType.LINK) {\n <div class=\"truncate\" matTooltip=\"{{ value }}\">\n <a href=\"{{value}}\" target=\"_blank\" class=\"underline\">{{ value }}</a>\n </div>\n }\n @case (DataType.VECTOR) {\n <div class=\"truncate\" matTooltip=\"{{ getVectorValue(value) }}\">{{ getVectorValue(value) }}</div>\n }\n @case (DataType.NUMERIC){\n <div class=\"truncate\" matTooltip=\"{{ getNumber(value) }} {{ unit() }}\">{{getNumber(value) | localizedNumber}} {{ unit() }}</div>\n }\n @default {\n <div class=\"truncate\" matTooltip=\"{{ value }} {{ unit() }}\">{{ value }} {{ unit() }}</div>\n }\n }\n} @else {\n -\n}\n", styles: [".color-circle{width:1.5rem;height:1.5rem;margin-top:.25rem;border-radius:9999px}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: DurationPipe, name: "duration" }, { kind: "pipe", type: SimpleDateTimePipe, name: "simpleDateTime" }, { kind: "pipe", type: LocalizedNumberPipe, name: "localizedNumber" }] });
|
|
5961
5962
|
}
|
|
5962
5963
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueDisplayComponent, decorators: [{
|
|
5963
5964
|
type: Component,
|
|
5964
|
-
args: [{ selector: 'app-value-display', imports: [SharedModule, DurationPipe, SimpleDateTimePipe, LocalizedNumberPipe], template: "@if (value(); as value) {\
|
|
5965
|
+
args: [{ selector: 'app-value-display', imports: [SharedModule, DurationPipe, SimpleDateTimePipe, LocalizedNumberPipe], template: "@if (value(); as value) {\n @switch (type()) {\n @case (DataType.BOOLEAN) {\n <mat-icon>{{ value === 'true' ? 'check' : 'close' }}</mat-icon>\n }\n @case (DataType.COLOR) {\n <div class=\"color-circle\" [style.background-color]=\"value\"></div>\n }\n @case (DataType.DATE) {\n <div class=\"truncate\" matTooltip=\"{{ getNumber(value) | simpleDateTime }}\">{{ getNumber(value) | simpleDateTime }}</div>\n }\n @case (DataType.DURATION) {\n {{ getNumber(value) | duration }}\n }\n @case (DataType.LINK) {\n <div class=\"truncate\" matTooltip=\"{{ value }}\">\n <a href=\"{{value}}\" target=\"_blank\" class=\"underline\">{{ value }}</a>\n </div>\n }\n @case (DataType.VECTOR) {\n <div class=\"truncate\" matTooltip=\"{{ getVectorValue(value) }}\">{{ getVectorValue(value) }}</div>\n }\n @case (DataType.NUMERIC){\n <div class=\"truncate\" matTooltip=\"{{ getNumber(value) }} {{ unit() }}\">{{getNumber(value) | localizedNumber}} {{ unit() }}</div>\n }\n @default {\n <div class=\"truncate\" matTooltip=\"{{ value }} {{ unit() }}\">{{ value }} {{ unit() }}</div>\n }\n }\n} @else {\n -\n}\n", styles: [".color-circle{width:1.5rem;height:1.5rem;margin-top:.25rem;border-radius:9999px}\n"] }]
|
|
5965
5966
|
}], ctorParameters: () => [], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: true }] }], unit: [{ type: i0.Input, args: [{ isSignal: true, alias: "unit", required: false }] }] } });
|
|
5966
5967
|
|
|
5967
5968
|
class ValueInputBooleanComponent {
|
|
@@ -6029,7 +6030,7 @@ class ValueInputBooleanComponent {
|
|
|
6029
6030
|
useExisting: forwardRef(() => ValueInputBooleanComponent),
|
|
6030
6031
|
multi: true,
|
|
6031
6032
|
}
|
|
6032
|
-
], ngImport: i0, template: "<mat-slide-toggle [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6033
|
+
], ngImport: i0, template: "<mat-slide-toggle [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <div class=\"flex flex-col ml-2\">\n <span class=\"text-xs font-light\"> {{ name() }} </span>\n <span>{{ formControl.value ? ('DATA_BROWSER.ATTRIBUTE_VALUE_ENABLED' | translate) : ('DATA_BROWSER.ATTRIBUTE_VALUE_DISABLED' | translate) }}</span>\n </div>\n</mat-slide-toggle>\n@for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\" class=\"ml-4 mt-[-8px] text-[12px]\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate }}</mat-error>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
6033
6034
|
}
|
|
6034
6035
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueInputBooleanComponent, decorators: [{
|
|
6035
6036
|
type: Component,
|
|
@@ -6044,7 +6045,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
6044
6045
|
useExisting: forwardRef(() => ValueInputBooleanComponent),
|
|
6045
6046
|
multi: true,
|
|
6046
6047
|
}
|
|
6047
|
-
], template: "<mat-slide-toggle [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6048
|
+
], template: "<mat-slide-toggle [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <div class=\"flex flex-col ml-2\">\n <span class=\"text-xs font-light\"> {{ name() }} </span>\n <span>{{ formControl.value ? ('DATA_BROWSER.ATTRIBUTE_VALUE_ENABLED' | translate) : ('DATA_BROWSER.ATTRIBUTE_VALUE_DISABLED' | translate) }}</span>\n </div>\n</mat-slide-toggle>\n@for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\" class=\"ml-4 mt-[-8px] text-[12px]\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate }}</mat-error>\n}\n" }]
|
|
6048
6049
|
}], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }], showErrorInTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showErrorInTooltip", required: false }] }] } });
|
|
6049
6050
|
|
|
6050
6051
|
class ValueInputColorComponent {
|
|
@@ -6137,7 +6138,7 @@ class ValueInputColorComponent {
|
|
|
6137
6138
|
useExisting: forwardRef(() => ValueInputColorComponent),
|
|
6138
6139
|
multi: true,
|
|
6139
6140
|
}
|
|
6140
|
-
], viewQueries: [{ propertyName: "colorPicker", first: true, predicate: ["colorPicker"], descendants: true, isSignal: true }], ngImport: i0, template: "<mat-form-field class=\"w-full relative\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6141
|
+
], viewQueries: [{ propertyName: "colorPicker", first: true, predicate: ["colorPicker"], descendants: true, isSignal: true }], ngImport: i0, template: "<mat-form-field class=\"w-full relative\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ name() }}</mat-label>\n <input matInput type=\"text\" [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" (click)=\"openColorPicker()\">\n <input type=\"color\" #colorPicker [value]=\"formControl.value\" (input)=\"onColorPickerChange($event)\" class=\"absolute opacity-0 right-55 top-full mt-1 z-10\" [class.hidden]=\"!showPicker\">\n <div class=\"w-5 h-5 rounded-full mr-4 cursor-pointer\" [style.background-color]=\"formControl.getRawValue()\" matSuffix (click)=\"openColorPicker()\"> </div>\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n</mat-form-field>\n", styles: ["mat-form-field input[type=color]{width:auto;height:auto}:host{--color-picker-width: 250px}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
6141
6142
|
}
|
|
6142
6143
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueInputColorComponent, decorators: [{
|
|
6143
6144
|
type: Component,
|
|
@@ -6152,7 +6153,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
6152
6153
|
useExisting: forwardRef(() => ValueInputColorComponent),
|
|
6153
6154
|
multi: true,
|
|
6154
6155
|
}
|
|
6155
|
-
], template: "<mat-form-field class=\"w-full relative\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6156
|
+
], template: "<mat-form-field class=\"w-full relative\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ name() }}</mat-label>\n <input matInput type=\"text\" [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" (click)=\"openColorPicker()\">\n <input type=\"color\" #colorPicker [value]=\"formControl.value\" (input)=\"onColorPickerChange($event)\" class=\"absolute opacity-0 right-55 top-full mt-1 z-10\" [class.hidden]=\"!showPicker\">\n <div class=\"w-5 h-5 rounded-full mr-4 cursor-pointer\" [style.background-color]=\"formControl.getRawValue()\" matSuffix (click)=\"openColorPicker()\"> </div>\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n</mat-form-field>\n", styles: ["mat-form-field input[type=color]{width:auto;height:auto}:host{--color-picker-width: 250px}\n"] }]
|
|
6156
6157
|
}], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], colorPicker: [{ type: i0.ViewChild, args: ['colorPicker', { isSignal: true }] }], validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }], showErrorInTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showErrorInTooltip", required: false }] }] } });
|
|
6157
6158
|
|
|
6158
6159
|
class ValueInputDateComponent {
|
|
@@ -6220,7 +6221,7 @@ class ValueInputDateComponent {
|
|
|
6220
6221
|
useExisting: forwardRef(() => ValueInputDateComponent),
|
|
6221
6222
|
multi: true,
|
|
6222
6223
|
}
|
|
6223
|
-
], ngImport: i0, template: "<app-date-time-form-field [formControl]=\"formControl\" [validators]=\"validators()\" [showErrorInTooltip]=\"showErrorInTooltip()\" class=\"w-full\"></app-date-time-form-field>\
|
|
6224
|
+
], ngImport: i0, template: "<app-date-time-form-field [formControl]=\"formControl\" [validators]=\"validators()\" [showErrorInTooltip]=\"showErrorInTooltip()\" class=\"w-full\"></app-date-time-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: DateTimeFormFieldComponent, selector: "app-date-time-form-field", inputs: ["dateLabel", "timeLabel", "validators", "showErrorInTooltip"] }] });
|
|
6224
6225
|
}
|
|
6225
6226
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueInputDateComponent, decorators: [{
|
|
6226
6227
|
type: Component,
|
|
@@ -6235,7 +6236,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
6235
6236
|
useExisting: forwardRef(() => ValueInputDateComponent),
|
|
6236
6237
|
multi: true,
|
|
6237
6238
|
}
|
|
6238
|
-
], template: "<app-date-time-form-field [formControl]=\"formControl\" [validators]=\"validators()\" [showErrorInTooltip]=\"showErrorInTooltip()\" class=\"w-full\"></app-date-time-form-field>\
|
|
6239
|
+
], template: "<app-date-time-form-field [formControl]=\"formControl\" [validators]=\"validators()\" [showErrorInTooltip]=\"showErrorInTooltip()\" class=\"w-full\"></app-date-time-form-field>\n" }]
|
|
6239
6240
|
}], ctorParameters: () => [], propDecorators: { validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }], showErrorInTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showErrorInTooltip", required: false }] }] } });
|
|
6240
6241
|
|
|
6241
6242
|
class ValueInputEnumComponent {
|
|
@@ -6310,7 +6311,7 @@ class ValueInputEnumComponent {
|
|
|
6310
6311
|
useExisting: forwardRef(() => ValueInputEnumComponent),
|
|
6311
6312
|
multi: true,
|
|
6312
6313
|
}
|
|
6313
|
-
], ngImport: i0, template: "<div class=\"w-full flex flex-col gap-y-2\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6314
|
+
], ngImport: i0, template: "<div class=\"w-full flex flex-col gap-y-2\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-form-field appearance=\"outline\" class=\"w-full\">\n <mat-label>{{ name() }}</mat-label>\n <mat-select [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\">\n @for (value of options(); track value) {\n <mat-option [value]=\"value\">{{ value }}</mat-option>\n }\n </mat-select>\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n </mat-form-field>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i4$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
6314
6315
|
}
|
|
6315
6316
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueInputEnumComponent, decorators: [{
|
|
6316
6317
|
type: Component,
|
|
@@ -6325,7 +6326,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
6325
6326
|
useExisting: forwardRef(() => ValueInputEnumComponent),
|
|
6326
6327
|
multi: true,
|
|
6327
6328
|
}
|
|
6328
|
-
], template: "<div class=\"w-full flex flex-col gap-y-2\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6329
|
+
], template: "<div class=\"w-full flex flex-col gap-y-2\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-form-field appearance=\"outline\" class=\"w-full\">\n <mat-label>{{ name() }}</mat-label>\n <mat-select [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\">\n @for (value of options(); track value) {\n <mat-option [value]=\"value\">{{ value }}</mat-option>\n }\n </mat-select>\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n </mat-form-field>\n</div>\n" }]
|
|
6329
6330
|
}], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }], showErrorInTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showErrorInTooltip", required: false }] }] } });
|
|
6330
6331
|
|
|
6331
6332
|
class ValueInputHexadecimalComponent {
|
|
@@ -6403,7 +6404,7 @@ class ValueInputHexadecimalComponent {
|
|
|
6403
6404
|
useExisting: forwardRef(() => ValueInputHexadecimalComponent),
|
|
6404
6405
|
multi: true,
|
|
6405
6406
|
}
|
|
6406
|
-
], ngImport: i0, template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6407
|
+
], ngImport: i0, template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ 'DATA_BROWSER.ATTRIBUTE_VALUE' | translate }}</mat-label>\n <input matInput type=\"text\" [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" autocomplete=\"off\"/>\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
6407
6408
|
}
|
|
6408
6409
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueInputHexadecimalComponent, decorators: [{
|
|
6409
6410
|
type: Component,
|
|
@@ -6418,7 +6419,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
6418
6419
|
useExisting: forwardRef(() => ValueInputHexadecimalComponent),
|
|
6419
6420
|
multi: true,
|
|
6420
6421
|
}
|
|
6421
|
-
], template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6422
|
+
], template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ 'DATA_BROWSER.ATTRIBUTE_VALUE' | translate }}</mat-label>\n <input matInput type=\"text\" [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" autocomplete=\"off\"/>\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n</mat-form-field>\n" }]
|
|
6422
6423
|
}], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }], showErrorInTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showErrorInTooltip", required: false }] }] } });
|
|
6423
6424
|
|
|
6424
6425
|
class ValueInputLinkComponent {
|
|
@@ -6497,7 +6498,7 @@ class ValueInputLinkComponent {
|
|
|
6497
6498
|
useExisting: forwardRef(() => ValueInputLinkComponent),
|
|
6498
6499
|
multi: true,
|
|
6499
6500
|
}
|
|
6500
|
-
], ngImport: i0, template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6501
|
+
], ngImport: i0, template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ 'DATA_BROWSER.ATTRIBUTE_VALUE' | translate }}</mat-label>\n <input matInput type=\"text\" [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" autocomplete=\"off\"/>\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
6501
6502
|
}
|
|
6502
6503
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueInputLinkComponent, decorators: [{
|
|
6503
6504
|
type: Component,
|
|
@@ -6512,7 +6513,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
6512
6513
|
useExisting: forwardRef(() => ValueInputLinkComponent),
|
|
6513
6514
|
multi: true,
|
|
6514
6515
|
}
|
|
6515
|
-
], template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6516
|
+
], template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ 'DATA_BROWSER.ATTRIBUTE_VALUE' | translate }}</mat-label>\n <input matInput type=\"text\" [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" autocomplete=\"off\"/>\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n</mat-form-field>\n" }]
|
|
6516
6517
|
}], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }], showErrorInTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showErrorInTooltip", required: false }] }] } });
|
|
6517
6518
|
|
|
6518
6519
|
class ValueInputLocationComponent {
|
|
@@ -6607,7 +6608,7 @@ class ValueInputLocationComponent {
|
|
|
6607
6608
|
useExisting: forwardRef(() => ValueInputLocationComponent),
|
|
6608
6609
|
multi: true,
|
|
6609
6610
|
}
|
|
6610
|
-
], ngImport: i0, template: "<form [formGroup]=\"formGroup\">\
|
|
6611
|
+
], ngImport: i0, template: "<form [formGroup]=\"formGroup\">\n <div class=\"flex flex-col gap-y-1\">\n <div class=\"flex gap-4 w-full justify-between items-start\">\n <mat-form-field class=\"flex-1\" [matTooltip]=\"getErrorTooltip('latitude')\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ 'DATA_BROWSER.ATTRIBUTE_LATITUDE' | translate }}</mat-label>\n <input matInput (paste)=\"handleLocationPaste($event, 'latitude')\" (blur)=\"this.formGroup.get('latitude')?.updateValueAndValidity()\" formControlName=\"latitude\" type=\"number\" autocomplete=\"off\">\n\n @for (error of getErrors('latitude'); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate: {max: 90, min: -90} }}</mat-error>\n }\n </mat-form-field>\n\n <mat-form-field class=\"flex-1\" [matTooltip]=\"getErrorTooltip('longitude')\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ 'DATA_BROWSER.ATTRIBUTE_LONGITUDE' | translate }}</mat-label>\n <input matInput (paste)=\"handleLocationPaste($event, 'longitude')\" (blur)=\"this.formGroup.get('longitude')?.updateValueAndValidity()\" formControlName=\"longitude\" type=\"number\" autocomplete=\"off\">\n\n @for (error of getErrors('longitude'); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate: {max: 180, min: -180} }}</mat-error>\n }\n </mat-form-field>\n </div>\n </div>\n</form>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
6611
6612
|
}
|
|
6612
6613
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueInputLocationComponent, decorators: [{
|
|
6613
6614
|
type: Component,
|
|
@@ -6622,7 +6623,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
6622
6623
|
useExisting: forwardRef(() => ValueInputLocationComponent),
|
|
6623
6624
|
multi: true,
|
|
6624
6625
|
}
|
|
6625
|
-
], template: "<form [formGroup]=\"formGroup\">\
|
|
6626
|
+
], template: "<form [formGroup]=\"formGroup\">\n <div class=\"flex flex-col gap-y-1\">\n <div class=\"flex gap-4 w-full justify-between items-start\">\n <mat-form-field class=\"flex-1\" [matTooltip]=\"getErrorTooltip('latitude')\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ 'DATA_BROWSER.ATTRIBUTE_LATITUDE' | translate }}</mat-label>\n <input matInput (paste)=\"handleLocationPaste($event, 'latitude')\" (blur)=\"this.formGroup.get('latitude')?.updateValueAndValidity()\" formControlName=\"latitude\" type=\"number\" autocomplete=\"off\">\n\n @for (error of getErrors('latitude'); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate: {max: 90, min: -90} }}</mat-error>\n }\n </mat-form-field>\n\n <mat-form-field class=\"flex-1\" [matTooltip]=\"getErrorTooltip('longitude')\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ 'DATA_BROWSER.ATTRIBUTE_LONGITUDE' | translate }}</mat-label>\n <input matInput (paste)=\"handleLocationPaste($event, 'longitude')\" (blur)=\"this.formGroup.get('longitude')?.updateValueAndValidity()\" formControlName=\"longitude\" type=\"number\" autocomplete=\"off\">\n\n @for (error of getErrors('longitude'); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate: {max: 180, min: -180} }}</mat-error>\n }\n </mat-form-field>\n </div>\n </div>\n</form>\n" }]
|
|
6626
6627
|
}], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }], showErrorInTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showErrorInTooltip", required: false }] }] } });
|
|
6627
6628
|
|
|
6628
6629
|
class ValueInputNumericComponent {
|
|
@@ -6651,7 +6652,7 @@ class ValueInputNumericComponent {
|
|
|
6651
6652
|
}
|
|
6652
6653
|
// ControlValueAccessor methods
|
|
6653
6654
|
writeValue(value) {
|
|
6654
|
-
if (
|
|
6655
|
+
if (value === null || value === undefined) {
|
|
6655
6656
|
this.formControl.reset();
|
|
6656
6657
|
}
|
|
6657
6658
|
else {
|
|
@@ -6704,7 +6705,7 @@ class ValueInputNumericComponent {
|
|
|
6704
6705
|
useExisting: forwardRef(() => ValueInputNumericComponent),
|
|
6705
6706
|
multi: true,
|
|
6706
6707
|
}
|
|
6707
|
-
], ngImport: i0, template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6708
|
+
], ngImport: i0, template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ name() }}</mat-label>\n <input matInput type=\"text\" [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" autocomplete=\"off\" wolkaboutLocalizedNumericInput/>\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: LocalizedNumericInputDirective, selector: "input[wolkaboutLocalizedNumericInput]" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
6708
6709
|
}
|
|
6709
6710
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueInputNumericComponent, decorators: [{
|
|
6710
6711
|
type: Component,
|
|
@@ -6719,7 +6720,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
6719
6720
|
useExisting: forwardRef(() => ValueInputNumericComponent),
|
|
6720
6721
|
multi: true,
|
|
6721
6722
|
}
|
|
6722
|
-
], template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6723
|
+
], template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ name() }}</mat-label>\n <input matInput type=\"text\" [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" autocomplete=\"off\" wolkaboutLocalizedNumericInput/>\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n</mat-form-field>\n" }]
|
|
6723
6724
|
}], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }], showErrorInTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showErrorInTooltip", required: false }] }] } });
|
|
6724
6725
|
|
|
6725
6726
|
class ValueInputStringComponent {
|
|
@@ -6793,7 +6794,7 @@ class ValueInputStringComponent {
|
|
|
6793
6794
|
useExisting: forwardRef(() => ValueInputStringComponent),
|
|
6794
6795
|
multi: true,
|
|
6795
6796
|
}
|
|
6796
|
-
], ngImport: i0, template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6797
|
+
], ngImport: i0, template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ name() }}</mat-label>\n <input matInput [type]=\"'text'\" [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" autocomplete=\"off\"/>\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate : {max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
6797
6798
|
}
|
|
6798
6799
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueInputStringComponent, decorators: [{
|
|
6799
6800
|
type: Component,
|
|
@@ -6808,7 +6809,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
6808
6809
|
useExisting: forwardRef(() => ValueInputStringComponent),
|
|
6809
6810
|
multi: true,
|
|
6810
6811
|
}
|
|
6811
|
-
], template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
6812
|
+
], template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ name() }}</mat-label>\n <input matInput [type]=\"'text'\" [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" autocomplete=\"off\"/>\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate : {max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n</mat-form-field>\n" }]
|
|
6812
6813
|
}], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }], showErrorInTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showErrorInTooltip", required: false }] }] } });
|
|
6813
6814
|
|
|
6814
6815
|
class ValueInputVectorComponent {
|
|
@@ -6902,7 +6903,7 @@ class ValueInputVectorComponent {
|
|
|
6902
6903
|
useExisting: forwardRef(() => ValueInputVectorComponent),
|
|
6903
6904
|
multi: true,
|
|
6904
6905
|
}
|
|
6905
|
-
], ngImport: i0, template: "<div class=\"w-full flex flex-col gap-y-2\">\
|
|
6906
|
+
], ngImport: i0, template: "<div class=\"w-full flex flex-col gap-y-2\">\n <mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ name() }} ({{ options()?.join(',') }})</mat-label>\n <input matInput [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" class=\"w-full\">\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n </mat-form-field>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
6906
6907
|
}
|
|
6907
6908
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueInputVectorComponent, decorators: [{
|
|
6908
6909
|
type: Component,
|
|
@@ -6917,7 +6918,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
6917
6918
|
useExisting: forwardRef(() => ValueInputVectorComponent),
|
|
6918
6919
|
multi: true,
|
|
6919
6920
|
}
|
|
6920
|
-
], template: "<div class=\"w-full flex flex-col gap-y-2\">\
|
|
6921
|
+
], template: "<div class=\"w-full flex flex-col gap-y-2\">\n <mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ name() }} ({{ options()?.join(',') }})</mat-label>\n <input matInput [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" class=\"w-full\">\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n </mat-form-field>\n</div>\n" }]
|
|
6921
6922
|
}], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], showErrorInTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showErrorInTooltip", required: false }] }], validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }] } });
|
|
6922
6923
|
|
|
6923
6924
|
class ValueInputDurationComponent {
|
|
@@ -6947,7 +6948,7 @@ class ValueInputDurationComponent {
|
|
|
6947
6948
|
});
|
|
6948
6949
|
}
|
|
6949
6950
|
writeValue(value) {
|
|
6950
|
-
if (
|
|
6951
|
+
if (value === null || value === undefined) {
|
|
6951
6952
|
this.formControl.reset();
|
|
6952
6953
|
}
|
|
6953
6954
|
else {
|
|
@@ -7018,7 +7019,7 @@ class ValueInputDurationComponent {
|
|
|
7018
7019
|
useExisting: forwardRef(() => ValueInputDurationComponent),
|
|
7019
7020
|
multi: true,
|
|
7020
7021
|
}
|
|
7021
|
-
], ngImport: i0, template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
7022
|
+
], ngImport: i0, template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ name() }}</mat-label>\n <input matInput [type]=\"'text'\" [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" autocomplete=\"off\"/>\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n</mat-form-field>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i4$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
7022
7023
|
}
|
|
7023
7024
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueInputDurationComponent, decorators: [{
|
|
7024
7025
|
type: Component,
|
|
@@ -7033,7 +7034,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
7033
7034
|
useExisting: forwardRef(() => ValueInputDurationComponent),
|
|
7034
7035
|
multi: true,
|
|
7035
7036
|
}
|
|
7036
|
-
], template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\
|
|
7037
|
+
], template: "<mat-form-field class=\"w-full\" [matTooltip]=\"getErrorTooltip()\" [matTooltipDisabled]=\"!showErrorInTooltip()\">\n <mat-label>{{ name() }}</mat-label>\n <input matInput [type]=\"'text'\" [formControl]=\"formControl\" (blur)=\"formControl.updateValueAndValidity()\" autocomplete=\"off\"/>\n\n @for (error of getErrors(); track error) {\n <mat-error *ngIf=\"!showErrorInTooltip()\">{{ 'COMMON.ERROR_VALIDATION_' + error | translate :{max: formControl.getError('maxlength')?.requiredLength} }}</mat-error>\n }\n</mat-form-field>\n" }]
|
|
7037
7038
|
}], ctorParameters: () => [{ type: i0.DestroyRef }, { type: i1$1.TranslateService }], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }], showErrorInTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showErrorInTooltip", required: false }] }] } });
|
|
7038
7039
|
|
|
7039
7040
|
class ValueInputComponent {
|
|
@@ -7113,7 +7114,7 @@ class ValueInputComponent {
|
|
|
7113
7114
|
useExisting: forwardRef(() => ValueInputComponent),
|
|
7114
7115
|
multi: true,
|
|
7115
7116
|
}
|
|
7116
|
-
], ngImport: i0, template: "@switch (dataType()) {\
|
|
7117
|
+
], ngImport: i0, template: "@switch (dataType()) {\n @case (DataType.STRING) {\n <app-value-input-string [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.NUMERIC) {\n <app-value-input-numeric [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.BOOLEAN) {\n <app-value-input-boolean [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.HEXADECIMAL) {\n <app-value-input-hexadecimal [showErrorInTooltip]=\"showErrorInTooltip()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.COLOR) {\n <app-value-input-color [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.LINK) {\n <app-value-input-link [showErrorInTooltip]=\"showErrorInTooltip()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.DATE) {\n <app-value-input-date [showErrorInTooltip]=\"showErrorInTooltip()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.DURATION) {\n <app-value-input-duration [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.LOCATION) {\n <app-value-input-location [showErrorInTooltip]=\"showErrorInTooltip()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.VECTOR) {\n <app-value-input-vector [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\" [options]=\"options()\"/>\n }\n @case (DataType.ENUM) {\n <app-value-input-enum [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\" [options]=\"options()\"/>\n }\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: ValueInputBooleanComponent, selector: "app-value-input-boolean", inputs: ["name", "validators", "showErrorInTooltip"] }, { kind: "component", type: ValueInputColorComponent, selector: "app-value-input-color", inputs: ["name", "validators", "showErrorInTooltip"] }, { kind: "component", type: ValueInputDateComponent, selector: "app-value-input-date", inputs: ["validators", "showErrorInTooltip"] }, { kind: "component", type: ValueInputEnumComponent, selector: "app-value-input-enum", inputs: ["options", "name", "validators", "showErrorInTooltip"] }, { kind: "component", type: ValueInputHexadecimalComponent, selector: "app-value-input-hexadecimal", inputs: ["validators", "showErrorInTooltip"] }, { kind: "component", type: ValueInputLinkComponent, selector: "app-value-input-link", inputs: ["validators", "showErrorInTooltip"] }, { kind: "component", type: ValueInputLocationComponent, selector: "app-value-input-location", inputs: ["validators", "showErrorInTooltip"] }, { kind: "component", type: ValueInputNumericComponent, selector: "app-value-input-numeric", inputs: ["name", "validators", "showErrorInTooltip"] }, { kind: "component", type: ValueInputStringComponent, selector: "app-value-input-string", inputs: ["name", "validators", "showErrorInTooltip"] }, { kind: "component", type: ValueInputVectorComponent, selector: "app-value-input-vector", inputs: ["options", "name", "showErrorInTooltip", "validators"] }, { kind: "component", type: ValueInputDurationComponent, selector: "app-value-input-duration", inputs: ["name", "validators", "showErrorInTooltip"] }] });
|
|
7117
7118
|
}
|
|
7118
7119
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: ValueInputComponent, decorators: [{
|
|
7119
7120
|
type: Component,
|
|
@@ -7128,7 +7129,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
|
|
|
7128
7129
|
useExisting: forwardRef(() => ValueInputComponent),
|
|
7129
7130
|
multi: true,
|
|
7130
7131
|
}
|
|
7131
|
-
], template: "@switch (dataType()) {\
|
|
7132
|
+
], template: "@switch (dataType()) {\n @case (DataType.STRING) {\n <app-value-input-string [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.NUMERIC) {\n <app-value-input-numeric [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.BOOLEAN) {\n <app-value-input-boolean [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.HEXADECIMAL) {\n <app-value-input-hexadecimal [showErrorInTooltip]=\"showErrorInTooltip()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.COLOR) {\n <app-value-input-color [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.LINK) {\n <app-value-input-link [showErrorInTooltip]=\"showErrorInTooltip()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.DATE) {\n <app-value-input-date [showErrorInTooltip]=\"showErrorInTooltip()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.DURATION) {\n <app-value-input-duration [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.LOCATION) {\n <app-value-input-location [showErrorInTooltip]=\"showErrorInTooltip()\" [validators]=\"validators()\" [formControl]=\"formControl\"/>\n }\n @case (DataType.VECTOR) {\n <app-value-input-vector [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\" [options]=\"options()\"/>\n }\n @case (DataType.ENUM) {\n <app-value-input-enum [showErrorInTooltip]=\"showErrorInTooltip()\" [name]=\"name()\" [validators]=\"validators()\" [formControl]=\"formControl\" [options]=\"options()\"/>\n }\n}\n" }]
|
|
7132
7133
|
}], ctorParameters: () => [], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }], dataType: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataType", required: true }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], validationConditions: [{ type: i0.Input, args: [{ isSignal: true, alias: "validationConditions", required: false }] }], showErrorInTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showErrorInTooltip", required: false }] }] } });
|
|
7133
7134
|
|
|
7134
7135
|
class DoubleDrawerLayoutComponent {
|
|
@@ -7215,13 +7216,13 @@ class DoubleDrawerLayoutComponent {
|
|
|
7215
7216
|
}
|
|
7216
7217
|
}
|
|
7217
7218
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DoubleDrawerLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7218
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DoubleDrawerLayoutComponent, isStandalone: true, selector: "app-double-drawer-layout", inputs: { leftDrawerConfig: { classPropertyName: "leftDrawerConfig", publicName: "leftDrawerConfig", isSignal: true, isRequired: true, transformFunction: null }, rightDrawerConfig: { classPropertyName: "rightDrawerConfig", publicName: "rightDrawerConfig", isSignal: true, isRequired: false, transformFunction: null }, backdropConfig: { classPropertyName: "backdropConfig", publicName: "backdropConfig", isSignal: true, isRequired: true, transformFunction: null }, dialogConfig: { classPropertyName: "dialogConfig", publicName: "dialogConfig", isSignal: true, isRequired: false, transformFunction: null }, enableFullScreen: { classPropertyName: "enableFullScreen", publicName: "enableFullScreen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { leftDrawerToggled: "leftDrawerToggled", rightDrawerToggled: "rightDrawerToggled" }, host: { listeners: { "window:mousemove": "onMouseMove()" } }, ngImport: i0, template: "<div class=\"w-full h-full relative\">\
|
|
7219
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: DoubleDrawerLayoutComponent, isStandalone: true, selector: "app-double-drawer-layout", inputs: { leftDrawerConfig: { classPropertyName: "leftDrawerConfig", publicName: "leftDrawerConfig", isSignal: true, isRequired: true, transformFunction: null }, rightDrawerConfig: { classPropertyName: "rightDrawerConfig", publicName: "rightDrawerConfig", isSignal: true, isRequired: false, transformFunction: null }, backdropConfig: { classPropertyName: "backdropConfig", publicName: "backdropConfig", isSignal: true, isRequired: true, transformFunction: null }, dialogConfig: { classPropertyName: "dialogConfig", publicName: "dialogConfig", isSignal: true, isRequired: false, transformFunction: null }, enableFullScreen: { classPropertyName: "enableFullScreen", publicName: "enableFullScreen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { leftDrawerToggled: "leftDrawerToggled", rightDrawerToggled: "rightDrawerToggled" }, host: { listeners: { "window:mousemove": "onMouseMove()" } }, ngImport: i0, template: "<div class=\"w-full h-full relative\">\n <div class=\"absolute h-full drawer\" [ngClass]=\"{open : isLeftDrawerOpen()}\" [ngStyle]=\"{'width': isLeftDrawerOpen() ? leftDrawerConfig().width : '0px'}\">\n <button mat-flat-button class=\"drawer-toggle\"\n (click)=\"isLeftDrawerOpen.set(!isLeftDrawerOpen())\"\n [ngClass]=\"{\n 'destructive-flat-button': isLeftDrawerOpen(),\n 'drawer-toggle-name': leftDrawerConfig().title && !isLeftDrawerOpen()\n }\"\n [matTooltip]=\"isLeftDrawerOpen() ?\n ('COMMON.COLLAPSE_NAVIGATION' | translate) :\n leftDrawerConfig().title ?\n leftDrawerConfig().title :\n ('COMMON.EXPAND_NAVIGATION' | translate)\"\n matTooltipPosition=\"right\">\n @if (leftDrawerConfig().title && !isLeftDrawerOpen()) {\n <span>{{ leftDrawerConfig().title }}</span>\n } @else {\n <span class=\"block\"><mat-icon [ngClass]=\"{'toggle-icon-small': !isLeftDrawerOpen()}\" [svgIcon]=\"isLeftDrawerOpen() ? 'close' : 'arrow_right'\"></mat-icon></span>\n }\n </button>\n <div class=\"h-full w-full\" [ngClass]=\"{'overflow-hidden': !isLeftDrawerOpen()}\">\n <ng-content select=\"[left-drawer]\"></ng-content>\n </div>\n </div>\n <div class=\"h-full w-full content-wrapper\" [ngClass]=\"{'open': (isLeftDrawerOpen() || isRightDrawerOpen()) && backdropConfig().show}\">\n <div class=\"message-wrapper\" [ngClass]=\"{'show': backdropConfig().showMessage}\">\n <span>{{ backdropConfig().message | translate }}</span>\n </div>\n <div class=\"content-backdrop\" [ngClass]=\"{'transparent': backdropConfig().showTransparentBackdrop}\" (click)=\"backdropClick()\">\n </div>\n <div class=\"flex flex-col flex-auto gap-4 h-full w-full overflow-hidden relative\">\n @if (showFullscreenButton()) {\n <button mat-icon-button type=\"button\" class=\"absolute top-2 right-3 !z-10\" [ngClass]=\"!isLeftDrawerOpen() && !isRightDrawerOpen() ? '!block' : '!hidden' \" (mouseover)=\"mouseOver()\" (mouseout)=\"hoverActive.set(false)\"\n [matTooltip]=\"fullScreenEnabled() ? ('COMMON.EXIT_FULLSCREEN' | translate) : ('COMMON.ENTER_FULLSCREEN' | translate)\" (click)=\"fullscreenService.toggleFullScreen(); hoverActive.set(false)\" matTooltipPosition=\"left\">\n @if (fullScreenEnabled()) {\n <mat-icon>fullscreen_exit</mat-icon>\n } @else {\n <mat-icon>fullscreen</mat-icon>\n }\n </button>\n }\n <ng-content select=\"[details]\"></ng-content>\n </div>\n </div>\n <div class=\"absolute h-full drawer right\" [ngClass]=\"{open : isRightDrawerOpen()}\" [ngStyle]=\"{'width': isRightDrawerOpen() ? rightDrawerConfig()?.width : '0px'}\">\n <button mat-flat-button class=\"drawer-toggle\"\n (click)=\"toggleRightDrawer()\"\n [ngClass]=\"{'destructive-flat-button': isRightDrawerOpen()}\"\n [matTooltip]=\"isRightDrawerOpen() ? ('COMMON.COLLAPSE_NAVIGATION' | translate) : ('COMMON.EXPAND_NAVIGATION' | translate)\"\n matTooltipPosition=\"right\">\n <span class=\"block\"><mat-icon [svgIcon]=\"isRightDrawerOpen() ? 'close' : 'arrow_left'\"></mat-icon></span>\n </button>\n <div class=\"h-full w-full\" [ngClass]=\"{'overflow-hidden': !isRightDrawerOpen()}\">\n <ng-content select=\"[right-drawer]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:flex;height:100%;width:100%;max-height:100%;max-width:100%;box-sizing:border-box}.drawer{z-index:10;width:0;max-width:calc(100% - 40px);transition:all .3s cubic-bezier(.4,0,.2,1) 0s;position:relative;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.drawer:after{content:\"\";display:block;width:100%;height:100%;opacity:.6;position:absolute;inset:0;background-color:var(--mat-sys-surface-container);z-index:-1}.drawer .drawer-toggle{position:absolute;bottom:16px;right:0;word-break:keep-all;white-space:nowrap;min-width:fit-content!important;width:fit-content!important;transform:translate(100%);border-radius:0 5px 5px 0!important;padding:0 10px}.drawer .drawer-toggle.drawer-toggle-name{max-width:300px!important;min-width:unset!important;overflow:hidden}.drawer .drawer-toggle.drawer-toggle-name span{display:block;max-width:280px;overflow:hidden;text-overflow:ellipsis}.drawer .drawer-toggle .toggle-icon-small{margin:0 6px;height:10px;width:10px}.drawer.right{right:0;top:0}.drawer.right .drawer-toggle{display:none;position:absolute;bottom:16px;left:0;transform:translate(-100%);border-radius:5px 0 0 5px!important}.drawer.right .drawer-toggle span{line-height:12px}.drawer.right .drawer-toggle span mat-icon{height:24px;width:24px}.drawer.open{border-right:1px solid var(--mat-sys-outline-variant)}.drawer.open.right .drawer-toggle{display:block}.drawer.open.right{border-right:unset;border-left:1px solid var(--mat-sys-outline-variant)}.drawer.open .drawer-toggle span{line-height:12px}.drawer.open .drawer-toggle span mat-icon{height:24px;width:24px}:host-context(.alt-theme) .drawer.after{background-color:var(--mat-sys-surface-container-lowest)}.content-wrapper{position:relative}.content-wrapper .content-backdrop{transition:all .3s cubic-bezier(.4,0,.2,1) 0s;width:100%;height:100%;position:absolute;top:0;left:0;opacity:0;z-index:-1;background-color:transparent}.content-wrapper .message-wrapper{transition:all .5s cubic-bezier(.4,0,.2,1) 0s;position:absolute;right:32px;top:24px;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:10px;padding:0 1rem;height:2.5rem;box-sizing:border-box;background-color:var(--mat-sys-primary);color:var(--mat-sys-surface-container);opacity:0;z-index:-1}.content-wrapper .message-wrapper.show{opacity:1;z-index:4}.content-wrapper.open .content-backdrop{background-color:#000;opacity:.5;z-index:3}.content-wrapper.open .content-backdrop.transparent{background-color:transparent}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i1$4.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i1$4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i9.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] });
|
|
7219
7220
|
}
|
|
7220
7221
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: DoubleDrawerLayoutComponent, decorators: [{
|
|
7221
7222
|
type: Component,
|
|
7222
7223
|
args: [{ selector: 'app-double-drawer-layout', imports: [
|
|
7223
7224
|
SharedModule
|
|
7224
|
-
], template: "<div class=\"w-full h-full relative\">\
|
|
7225
|
+
], template: "<div class=\"w-full h-full relative\">\n <div class=\"absolute h-full drawer\" [ngClass]=\"{open : isLeftDrawerOpen()}\" [ngStyle]=\"{'width': isLeftDrawerOpen() ? leftDrawerConfig().width : '0px'}\">\n <button mat-flat-button class=\"drawer-toggle\"\n (click)=\"isLeftDrawerOpen.set(!isLeftDrawerOpen())\"\n [ngClass]=\"{\n 'destructive-flat-button': isLeftDrawerOpen(),\n 'drawer-toggle-name': leftDrawerConfig().title && !isLeftDrawerOpen()\n }\"\n [matTooltip]=\"isLeftDrawerOpen() ?\n ('COMMON.COLLAPSE_NAVIGATION' | translate) :\n leftDrawerConfig().title ?\n leftDrawerConfig().title :\n ('COMMON.EXPAND_NAVIGATION' | translate)\"\n matTooltipPosition=\"right\">\n @if (leftDrawerConfig().title && !isLeftDrawerOpen()) {\n <span>{{ leftDrawerConfig().title }}</span>\n } @else {\n <span class=\"block\"><mat-icon [ngClass]=\"{'toggle-icon-small': !isLeftDrawerOpen()}\" [svgIcon]=\"isLeftDrawerOpen() ? 'close' : 'arrow_right'\"></mat-icon></span>\n }\n </button>\n <div class=\"h-full w-full\" [ngClass]=\"{'overflow-hidden': !isLeftDrawerOpen()}\">\n <ng-content select=\"[left-drawer]\"></ng-content>\n </div>\n </div>\n <div class=\"h-full w-full content-wrapper\" [ngClass]=\"{'open': (isLeftDrawerOpen() || isRightDrawerOpen()) && backdropConfig().show}\">\n <div class=\"message-wrapper\" [ngClass]=\"{'show': backdropConfig().showMessage}\">\n <span>{{ backdropConfig().message | translate }}</span>\n </div>\n <div class=\"content-backdrop\" [ngClass]=\"{'transparent': backdropConfig().showTransparentBackdrop}\" (click)=\"backdropClick()\">\n </div>\n <div class=\"flex flex-col flex-auto gap-4 h-full w-full overflow-hidden relative\">\n @if (showFullscreenButton()) {\n <button mat-icon-button type=\"button\" class=\"absolute top-2 right-3 !z-10\" [ngClass]=\"!isLeftDrawerOpen() && !isRightDrawerOpen() ? '!block' : '!hidden' \" (mouseover)=\"mouseOver()\" (mouseout)=\"hoverActive.set(false)\"\n [matTooltip]=\"fullScreenEnabled() ? ('COMMON.EXIT_FULLSCREEN' | translate) : ('COMMON.ENTER_FULLSCREEN' | translate)\" (click)=\"fullscreenService.toggleFullScreen(); hoverActive.set(false)\" matTooltipPosition=\"left\">\n @if (fullScreenEnabled()) {\n <mat-icon>fullscreen_exit</mat-icon>\n } @else {\n <mat-icon>fullscreen</mat-icon>\n }\n </button>\n }\n <ng-content select=\"[details]\"></ng-content>\n </div>\n </div>\n <div class=\"absolute h-full drawer right\" [ngClass]=\"{open : isRightDrawerOpen()}\" [ngStyle]=\"{'width': isRightDrawerOpen() ? rightDrawerConfig()?.width : '0px'}\">\n <button mat-flat-button class=\"drawer-toggle\"\n (click)=\"toggleRightDrawer()\"\n [ngClass]=\"{'destructive-flat-button': isRightDrawerOpen()}\"\n [matTooltip]=\"isRightDrawerOpen() ? ('COMMON.COLLAPSE_NAVIGATION' | translate) : ('COMMON.EXPAND_NAVIGATION' | translate)\"\n matTooltipPosition=\"right\">\n <span class=\"block\"><mat-icon [svgIcon]=\"isRightDrawerOpen() ? 'close' : 'arrow_left'\"></mat-icon></span>\n </button>\n <div class=\"h-full w-full\" [ngClass]=\"{'overflow-hidden': !isRightDrawerOpen()}\">\n <ng-content select=\"[right-drawer]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:flex;height:100%;width:100%;max-height:100%;max-width:100%;box-sizing:border-box}.drawer{z-index:10;width:0;max-width:calc(100% - 40px);transition:all .3s cubic-bezier(.4,0,.2,1) 0s;position:relative;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.drawer:after{content:\"\";display:block;width:100%;height:100%;opacity:.6;position:absolute;inset:0;background-color:var(--mat-sys-surface-container);z-index:-1}.drawer .drawer-toggle{position:absolute;bottom:16px;right:0;word-break:keep-all;white-space:nowrap;min-width:fit-content!important;width:fit-content!important;transform:translate(100%);border-radius:0 5px 5px 0!important;padding:0 10px}.drawer .drawer-toggle.drawer-toggle-name{max-width:300px!important;min-width:unset!important;overflow:hidden}.drawer .drawer-toggle.drawer-toggle-name span{display:block;max-width:280px;overflow:hidden;text-overflow:ellipsis}.drawer .drawer-toggle .toggle-icon-small{margin:0 6px;height:10px;width:10px}.drawer.right{right:0;top:0}.drawer.right .drawer-toggle{display:none;position:absolute;bottom:16px;left:0;transform:translate(-100%);border-radius:5px 0 0 5px!important}.drawer.right .drawer-toggle span{line-height:12px}.drawer.right .drawer-toggle span mat-icon{height:24px;width:24px}.drawer.open{border-right:1px solid var(--mat-sys-outline-variant)}.drawer.open.right .drawer-toggle{display:block}.drawer.open.right{border-right:unset;border-left:1px solid var(--mat-sys-outline-variant)}.drawer.open .drawer-toggle span{line-height:12px}.drawer.open .drawer-toggle span mat-icon{height:24px;width:24px}:host-context(.alt-theme) .drawer.after{background-color:var(--mat-sys-surface-container-lowest)}.content-wrapper{position:relative}.content-wrapper .content-backdrop{transition:all .3s cubic-bezier(.4,0,.2,1) 0s;width:100%;height:100%;position:absolute;top:0;left:0;opacity:0;z-index:-1;background-color:transparent}.content-wrapper .message-wrapper{transition:all .5s cubic-bezier(.4,0,.2,1) 0s;position:absolute;right:32px;top:24px;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:10px;padding:0 1rem;height:2.5rem;box-sizing:border-box;background-color:var(--mat-sys-primary);color:var(--mat-sys-surface-container);opacity:0;z-index:-1}.content-wrapper .message-wrapper.show{opacity:1;z-index:4}.content-wrapper.open .content-backdrop{background-color:#000;opacity:.5;z-index:3}.content-wrapper.open .content-backdrop.transparent{background-color:transparent}\n"] }]
|
|
7225
7226
|
}], ctorParameters: () => [], propDecorators: { onMouseMove: [{
|
|
7226
7227
|
type: HostListener,
|
|
7227
7228
|
args: ['window:mousemove']
|