@muziehdesign/components 19.2.0-beta.2377 → 19.2.0-beta.2397
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/muziehdesign-components.mjs +108 -108
- package/fesm2022/muziehdesign-components.mjs.map +1 -1
- package/lib/dialog/dialog-injectors.d.ts +1 -1
- package/package.json +4 -6
- package/styles/design/_muzieh.scss +19 -19
- package/esm2022/lib/alert/alert.component.mjs +0 -46
- package/esm2022/lib/button.directive.mjs +0 -86
- package/esm2022/lib/components.module.mjs +0 -130
- package/esm2022/lib/date-display/date-display-config.mjs +0 -12
- package/esm2022/lib/date-display/date-display.pipe.mjs +0 -35
- package/esm2022/lib/date-display/date.pipe.mjs +0 -41
- package/esm2022/lib/date-time/date-time.component.mjs +0 -139
- package/esm2022/lib/date-time/time-value.mjs +0 -2
- package/esm2022/lib/dialog/container/drawer-container.component.mjs +0 -57
- package/esm2022/lib/dialog/dialog-config.mjs +0 -50
- package/esm2022/lib/dialog/dialog-injectors.mjs +0 -5
- package/esm2022/lib/dialog/dialog-ref.mjs +0 -57
- package/esm2022/lib/dialog/dialog.module.mjs +0 -25
- package/esm2022/lib/dialog/mz-dialog.service.mjs +0 -108
- package/esm2022/lib/dropdown/dropdown-item.directive.mjs +0 -28
- package/esm2022/lib/dropdown/dropdown.component.mjs +0 -27
- package/esm2022/lib/dropdown/dropdown.module.mjs +0 -17
- package/esm2022/lib/enum-display/enum-display.pipe.mjs +0 -48
- package/esm2022/lib/filter/filter-option.model.mjs +0 -2
- package/esm2022/lib/filter/filter.component.mjs +0 -42
- package/esm2022/lib/guard-deactivate.mjs +0 -14
- package/esm2022/lib/infinite-scroll/infinite-scroll.component.mjs +0 -45
- package/esm2022/lib/inline-edit/inline-edit.component.mjs +0 -65
- package/esm2022/lib/models/loading-state.mjs +0 -2
- package/esm2022/lib/models/page-event.mjs +0 -2
- package/esm2022/lib/models/result-table-options.mjs +0 -2
- package/esm2022/lib/models/sort-event.mjs +0 -2
- package/esm2022/lib/models/subject.mjs +0 -2
- package/esm2022/lib/models/wizard-step-link.mjs +0 -2
- package/esm2022/lib/options-filter/options-filter.component.mjs +0 -66
- package/esm2022/lib/page-header/page-header.component.mjs +0 -27
- package/esm2022/lib/page-loading-indicator/page-loading-indicator.component.mjs +0 -32
- package/esm2022/lib/pagination/pagination-default-options.mjs +0 -2
- package/esm2022/lib/pagination/pagination-default-options.token.mjs +0 -3
- package/esm2022/lib/pagination/pagination.component.mjs +0 -90
- package/esm2022/lib/phone-number/phone-number.pipe.mjs +0 -24
- package/esm2022/lib/result-table/result-table.component.mjs +0 -65
- package/esm2022/lib/result-table/result-table.model.mjs +0 -2
- package/esm2022/lib/sort-key.directive.mjs +0 -91
- package/esm2022/lib/sort.directive.mjs +0 -34
- package/esm2022/lib/spinner/spinner.component.mjs +0 -21
- package/esm2022/lib/subject-display/subject-display.pipe.mjs +0 -20
- package/esm2022/lib/svg-icon/svg-icon-config.mjs +0 -10
- package/esm2022/lib/svg-icon/svg-icon.component.mjs +0 -39
- package/esm2022/lib/testing/muzieh-component-harness.mjs +0 -3
- package/esm2022/lib/testing/result-table-harness.mjs +0 -66
- package/esm2022/lib/time-value-accessor.directive.mjs +0 -57
- package/esm2022/lib/time-value-validator.directive.mjs +0 -37
- package/esm2022/lib/wizard-progress-tracker/wizard-progress-tracker.component.mjs +0 -32
- package/esm2022/muziehdesign-components.mjs +0 -5
- package/esm2022/public-api.mjs +0 -53
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { InjectionToken,
|
|
2
|
+
import { InjectionToken, HostBinding, Input, Inject, Component, Pipe, EventEmitter, Output, Optional, ContentChild, HostListener, Directive, forwardRef, ViewChild, NgModule, LOCALE_ID, ElementRef, Injectable, ViewEncapsulation, Host } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule, DatePipe, DOCUMENT } from '@angular/common';
|
|
5
5
|
import * as i1$1 from '@angular/router';
|
|
@@ -44,12 +44,12 @@ class SvgIconComponent {
|
|
|
44
44
|
get classes() {
|
|
45
45
|
return `icon icon-${this.type} icon-${this.size}`;
|
|
46
46
|
}
|
|
47
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
48
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
47
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SvgIconComponent, deps: [{ token: SVG_ICON_DEFAULT_OPTIONS }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
48
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.8", type: SvgIconComponent, isStandalone: true, selector: "mz-svg-icon", inputs: { key: "key", type: "type", size: "size" }, host: { properties: { "class": "this.classes" } }, ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n <use [attr.href]=\"url\" />\n</svg>", styles: [":host.icon-medium{width:1.25rem;height:1.25rem}:host.icon{display:inline-block}svg{height:100%;width:100%}\n"] }); }
|
|
49
49
|
}
|
|
50
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
50
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SvgIconComponent, decorators: [{
|
|
51
51
|
type: Component,
|
|
52
|
-
args: [{ selector: 'mz-svg-icon',
|
|
52
|
+
args: [{ selector: 'mz-svg-icon', imports: [], template: "<svg xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\">\n <use [attr.href]=\"url\" />\n</svg>", styles: [":host.icon-medium{width:1.25rem;height:1.25rem}:host.icon{display:inline-block}svg{height:100%;width:100%}\n"] }]
|
|
53
53
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
54
54
|
type: Inject,
|
|
55
55
|
args: [SVG_ICON_DEFAULT_OPTIONS]
|
|
@@ -99,10 +99,10 @@ class EnumDisplayPipe {
|
|
|
99
99
|
firstLetterToUppercase(value) {
|
|
100
100
|
return value.length > 1 ? `${value.substring(0, 1).toUpperCase()}${value.substring(1)}` : value.toUpperCase();
|
|
101
101
|
}
|
|
102
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
103
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
102
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: EnumDisplayPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
103
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.8", ngImport: i0, type: EnumDisplayPipe, isStandalone: true, name: "mzEnumDisplay" }); }
|
|
104
104
|
}
|
|
105
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
105
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: EnumDisplayPipe, decorators: [{
|
|
106
106
|
type: Pipe,
|
|
107
107
|
args: [{
|
|
108
108
|
name: 'mzEnumDisplay',
|
|
@@ -115,12 +115,12 @@ class SpinnerComponent {
|
|
|
115
115
|
this.size = 'medium';
|
|
116
116
|
this.type = 'primary';
|
|
117
117
|
}
|
|
118
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
119
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
118
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
119
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.8", type: SpinnerComponent, isStandalone: true, selector: "mz-spinner", inputs: { size: "size", type: "type" }, ngImport: i0, template: "<svg class=\"mz-spinner\" [ngClass]=\"{'large': size == 'large', 'medium': size == 'medium', 'text-primary': type == 'primary', 'text-secondary': type == 'secondary'}\" xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\" viewBox=\"0 0 24 24\">\n <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n <path class=\"opacity-75\" fill=\"currentColor\"\n d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\">\n </path>\n</svg>\n", styles: [".mz-spinner{animation:spin 1s linear infinite;margin:auto}.mz-spinner.medium{height:1.25rem;width:1.25rem}.mz-spinner.large{height:4rem;width:4rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
120
120
|
}
|
|
121
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
121
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SpinnerComponent, decorators: [{
|
|
122
122
|
type: Component,
|
|
123
|
-
args: [{ selector: 'mz-spinner',
|
|
123
|
+
args: [{ selector: 'mz-spinner', imports: [CommonModule], template: "<svg class=\"mz-spinner\" [ngClass]=\"{'large': size == 'large', 'medium': size == 'medium', 'text-primary': type == 'primary', 'text-secondary': type == 'secondary'}\" xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"none\" viewBox=\"0 0 24 24\">\n <circle class=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\"></circle>\n <path class=\"opacity-75\" fill=\"currentColor\"\n d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\">\n </path>\n</svg>\n", styles: [".mz-spinner{animation:spin 1s linear infinite;margin:auto}.mz-spinner.medium{height:1.25rem;width:1.25rem}.mz-spinner.large{height:4rem;width:4rem}\n"] }]
|
|
124
124
|
}], ctorParameters: () => [], propDecorators: { size: [{
|
|
125
125
|
type: Input
|
|
126
126
|
}], type: [{
|
|
@@ -190,12 +190,12 @@ class PaginationComponent {
|
|
|
190
190
|
}
|
|
191
191
|
this.pages = pageNumbers;
|
|
192
192
|
}
|
|
193
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
194
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
193
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: PaginationComponent, deps: [{ token: PAGINATION_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
194
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.8", type: PaginationComponent, isStandalone: true, selector: "mz-pagination", inputs: { length: "length", page: "page", pageSize: "pageSize", pageSizeOptions: "pageSizeOptions" }, outputs: { changePage: "changePage" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"pagination-wrapper\">\n <nav class=\"pagination-nav\" aria-label=\"pagination\">\n <button class=\"page-link\" [ngClass]=\"{'disabled': page == 1}\" (click)=\"changePageNumber(page-1)\">\n <span class=\"sr-only\">Previous page</span>\n <mz-svg-icon key=\"chevron-left\"></mz-svg-icon>\n </button>\n <ng-container *ngFor=\"let p of pages\">\n <span class=\"page-ellipsis page-link disabled\" *ngIf=\"isEllipsis(p)\">...</span>\n <button class=\"page-link\" [ngClass]=\"{'active': p == page}\" (click)=\"changePageNumber(p)\"\n *ngIf=\"!isEllipsis(p)\">{{p}}</button>\n </ng-container>\n <button class=\"page-link\" [ngClass]=\"{'disabled': page == pageCount}\" (click)=\"changePageNumber(page+1)\">\n <span class=\"sr-only\">Next page</span>\n <mz-svg-icon key=\"chevron-right\"></mz-svg-icon>\n </button>\n </nav>\n <div class=\"pagination-size\">\n Show\n <select #c (change)=\"changePageSize(c.value)\" name=\"pageSizeControl\" class=\"page-size-control\">\n <option *ngFor=\"let size of pageSizeOptions\" [attr.selected]=\"pageSize == size ? true : null\"\n [value]=\"size\">{{size}}</option>\n </select>\n per page\n </div>\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SvgIconComponent, selector: "mz-svg-icon", inputs: ["key", "type", "size"] }] }); }
|
|
195
195
|
}
|
|
196
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
196
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: PaginationComponent, decorators: [{
|
|
197
197
|
type: Component,
|
|
198
|
-
args: [{ selector: 'mz-pagination', imports: [CommonModule, SvgIconComponent],
|
|
198
|
+
args: [{ selector: 'mz-pagination', imports: [CommonModule, SvgIconComponent], template: "<div class=\"pagination-wrapper\">\n <nav class=\"pagination-nav\" aria-label=\"pagination\">\n <button class=\"page-link\" [ngClass]=\"{'disabled': page == 1}\" (click)=\"changePageNumber(page-1)\">\n <span class=\"sr-only\">Previous page</span>\n <mz-svg-icon key=\"chevron-left\"></mz-svg-icon>\n </button>\n <ng-container *ngFor=\"let p of pages\">\n <span class=\"page-ellipsis page-link disabled\" *ngIf=\"isEllipsis(p)\">...</span>\n <button class=\"page-link\" [ngClass]=\"{'active': p == page}\" (click)=\"changePageNumber(p)\"\n *ngIf=\"!isEllipsis(p)\">{{p}}</button>\n </ng-container>\n <button class=\"page-link\" [ngClass]=\"{'disabled': page == pageCount}\" (click)=\"changePageNumber(page+1)\">\n <span class=\"sr-only\">Next page</span>\n <mz-svg-icon key=\"chevron-right\"></mz-svg-icon>\n </button>\n </nav>\n <div class=\"pagination-size\">\n Show\n <select #c (change)=\"changePageSize(c.value)\" name=\"pageSizeControl\" class=\"page-size-control\">\n <option *ngFor=\"let size of pageSizeOptions\" [attr.selected]=\"pageSize == size ? true : null\"\n [value]=\"size\">{{size}}</option>\n </select>\n per page\n </div>\n</div>" }]
|
|
199
199
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
200
200
|
type: Optional
|
|
201
201
|
}, {
|
|
@@ -245,12 +245,12 @@ class ResultTableComponent {
|
|
|
245
245
|
get isEmpty() {
|
|
246
246
|
return !this.model || this.model.items.length === 0;
|
|
247
247
|
}
|
|
248
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
249
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
248
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ResultTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
249
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: ResultTableComponent, isStandalone: true, selector: "mz-result-table", inputs: { loading: "loading", error: "error", model: "model", pageSizeOptions: "pageSizeOptions", options: "options" }, outputs: { pageChange: "pageChange" }, queries: [{ propertyName: "headerTemplate", first: true, predicate: ["headerTemplate"], descendants: true }, { propertyName: "bodyTemplate", first: true, predicate: ["bodyTemplate"], descendants: true }], ngImport: i0, template: "<div class=\"result-table\" [ngClass]=\"{'loading': state === 'loading', 'failed': state === 'failed'}\" #tableRef>\n <div class=\"loading-overlay-spinner\" *ngIf=\"state === 'loading'\">\n <mz-spinner size=\"large\" type=\"primary\"></mz-spinner>\n </div>\n <table class=\"table\" [ngClass]=\"{'has-overlay' : state === 'loading'}\">\n <caption *ngIf=\"state === 'succeeded' && model && model.items.length > 0\">\n {{(model.pageNumber-1) * model.pageSize + 1}} - {{(model.pageNumber-1) * model.pageSize + model.items.length}} of {{ model.totalItems }} results\n </caption>\n <thead>\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n </thead>\n <tbody>\n @if(state === 'succeeded' && !isEmpty) {\n <ng-container *ngTemplateOutlet=\"bodyTemplate\"></ng-container>\n }\n </tbody>\n </table>\n <div class=\"table-pagination\" *ngIf=\"state === 'succeeded' && !options?.hidePagination && !isEmpty\">\n <mz-pagination [length]=\"model!.totalItems\" [page]=\"model!.pageNumber\" [pageSize]=\"model!.pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (changePage)=\"changePage($event, tableRef)\"></mz-pagination>\n </div>\n <div class=\"state-message\" *ngIf=\"state == 'succeeded' && isEmpty\">\n <div class=\"title\">No results found</div>\n </div>\n <div class=\"state-message\" *ngIf=\"state == 'failed'\">\n <div class=\"title\">\n <mz-svg-icon key=\"x-circle\" type=\"solid\" class=\"text-danger\"></mz-svg-icon>\n Something went wrong\n </div>\n <div>Unexpected error, <a (click)=\"searchAgain()\" class=\"link-action\">try searching again</a>.</div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: PaginationComponent, selector: "mz-pagination", inputs: ["length", "page", "pageSize", "pageSizeOptions"], outputs: ["changePage"] }, { kind: "component", type: SpinnerComponent, selector: "mz-spinner", inputs: ["size", "type"] }, { kind: "component", type: SvgIconComponent, selector: "mz-svg-icon", inputs: ["key", "type", "size"] }] }); }
|
|
250
250
|
}
|
|
251
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
251
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ResultTableComponent, decorators: [{
|
|
252
252
|
type: Component,
|
|
253
|
-
args: [{ selector: 'mz-result-table', imports: [CommonModule, PaginationComponent, SpinnerComponent, SvgIconComponent],
|
|
253
|
+
args: [{ selector: 'mz-result-table', imports: [CommonModule, PaginationComponent, SpinnerComponent, SvgIconComponent], template: "<div class=\"result-table\" [ngClass]=\"{'loading': state === 'loading', 'failed': state === 'failed'}\" #tableRef>\n <div class=\"loading-overlay-spinner\" *ngIf=\"state === 'loading'\">\n <mz-spinner size=\"large\" type=\"primary\"></mz-spinner>\n </div>\n <table class=\"table\" [ngClass]=\"{'has-overlay' : state === 'loading'}\">\n <caption *ngIf=\"state === 'succeeded' && model && model.items.length > 0\">\n {{(model.pageNumber-1) * model.pageSize + 1}} - {{(model.pageNumber-1) * model.pageSize + model.items.length}} of {{ model.totalItems }} results\n </caption>\n <thead>\n <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n </thead>\n <tbody>\n @if(state === 'succeeded' && !isEmpty) {\n <ng-container *ngTemplateOutlet=\"bodyTemplate\"></ng-container>\n }\n </tbody>\n </table>\n <div class=\"table-pagination\" *ngIf=\"state === 'succeeded' && !options?.hidePagination && !isEmpty\">\n <mz-pagination [length]=\"model!.totalItems\" [page]=\"model!.pageNumber\" [pageSize]=\"model!.pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n (changePage)=\"changePage($event, tableRef)\"></mz-pagination>\n </div>\n <div class=\"state-message\" *ngIf=\"state == 'succeeded' && isEmpty\">\n <div class=\"title\">No results found</div>\n </div>\n <div class=\"state-message\" *ngIf=\"state == 'failed'\">\n <div class=\"title\">\n <mz-svg-icon key=\"x-circle\" type=\"solid\" class=\"text-danger\"></mz-svg-icon>\n Something went wrong\n </div>\n <div>Unexpected error, <a (click)=\"searchAgain()\" class=\"link-action\">try searching again</a>.</div>\n </div>\n</div>\n" }]
|
|
254
254
|
}], ctorParameters: () => [], propDecorators: { loading: [{
|
|
255
255
|
type: Input
|
|
256
256
|
}], error: [{
|
|
@@ -285,12 +285,12 @@ class PageLoadingIndicatorComponent {
|
|
|
285
285
|
// the flag need to be reset to false when the page finishes loading
|
|
286
286
|
endObs$.subscribe(() => (this.isLoading = false));
|
|
287
287
|
}
|
|
288
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
289
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
288
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: PageLoadingIndicatorComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
289
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.8", type: PageLoadingIndicatorComponent, isStandalone: true, selector: "mz-page-loading-indicator", inputs: { isLoading: "isLoading" }, ngImport: i0, template: "<div class=\"progress-bar-container\" *ngIf=\"isLoading\">\n <div class=\"progress-bar progress-bar-indeterminate\">\n <div class=\"progress-bar-value\"></div>\n </div>\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
290
290
|
}
|
|
291
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
291
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: PageLoadingIndicatorComponent, decorators: [{
|
|
292
292
|
type: Component,
|
|
293
|
-
args: [{ selector: 'mz-page-loading-indicator', imports: [CommonModule],
|
|
293
|
+
args: [{ selector: 'mz-page-loading-indicator', imports: [CommonModule], template: "<div class=\"progress-bar-container\" *ngIf=\"isLoading\">\n <div class=\"progress-bar progress-bar-indeterminate\">\n <div class=\"progress-bar-value\"></div>\n </div>\n</div>" }]
|
|
294
294
|
}], ctorParameters: () => [{ type: i1$1.Router }], propDecorators: { isLoading: [{
|
|
295
295
|
type: Input
|
|
296
296
|
}] } });
|
|
@@ -308,10 +308,10 @@ class PageHeaderComponent {
|
|
|
308
308
|
this.title.setTitle(newValue);
|
|
309
309
|
}
|
|
310
310
|
ngOnInit() { }
|
|
311
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
312
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
311
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: PageHeaderComponent, deps: [{ token: i1$2.Title }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
312
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.8", type: PageHeaderComponent, isStandalone: true, selector: "mz-page-header", inputs: { pageTitle: "pageTitle" }, ngImport: i0, template: "<header class=\"page-header\">\n <h1>{{ pageTitle }}</h1>\n <ng-content></ng-content>\n</header>", styles: [""] }); }
|
|
313
313
|
}
|
|
314
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
314
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: PageHeaderComponent, decorators: [{
|
|
315
315
|
type: Component,
|
|
316
316
|
args: [{ selector: 'mz-page-header', standalone: true, template: "<header class=\"page-header\">\n <h1>{{ pageTitle }}</h1>\n <ng-content></ng-content>\n</header>" }]
|
|
317
317
|
}], ctorParameters: () => [{ type: i1$2.Title }], propDecorators: { pageTitle: [{
|
|
@@ -349,14 +349,14 @@ class TimeValueAccessorDirective {
|
|
|
349
349
|
registerOnTouched(fn) {
|
|
350
350
|
this.onTouched = fn;
|
|
351
351
|
}
|
|
352
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
353
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
352
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: TimeValueAccessorDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
353
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.8", type: TimeValueAccessorDirective, isStandalone: true, selector: "input[type=time]", host: { listeners: { "input": "onChange($event.target.value)" } }, providers: [{
|
|
354
354
|
provide: NG_VALUE_ACCESSOR,
|
|
355
355
|
useExisting: TimeValueAccessorDirective,
|
|
356
356
|
multi: true
|
|
357
357
|
}], ngImport: i0 }); }
|
|
358
358
|
}
|
|
359
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
359
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: TimeValueAccessorDirective, decorators: [{
|
|
360
360
|
type: Directive,
|
|
361
361
|
args: [{
|
|
362
362
|
selector: 'input[type=time]',
|
|
@@ -397,12 +397,12 @@ class AlertComponent {
|
|
|
397
397
|
}
|
|
398
398
|
return icon;
|
|
399
399
|
}
|
|
400
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
401
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
400
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: AlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
401
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.8", type: AlertComponent, isStandalone: true, selector: "mz-alert", inputs: { title: "title", type: "type", body: "body", footer: "footer" }, ngImport: i0, template: "<div [className]=\"'alert alert-' + type\">\n\n <div>\n <div class=\"alert-icon\">\n <mz-svg-icon [key]=\"getAlertIcon()\" type=\"solid\"></mz-svg-icon>\n </div>\n\n <div class=\"alert-title\">\n <strong>{{ title }}</strong>\n </div>\n </div>\n\n <div class=\"alert-body\" *ngIf=\"body\">\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\n </div>\n\n <div class=\"alert-footer\" *ngIf=\"footer\">\n <ng-container *ngTemplateOutlet=\"footer\"></ng-container>\n </div>\n\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SvgIconComponent, selector: "mz-svg-icon", inputs: ["key", "type", "size"] }] }); }
|
|
402
402
|
}
|
|
403
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
403
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: AlertComponent, decorators: [{
|
|
404
404
|
type: Component,
|
|
405
|
-
args: [{ selector: 'mz-alert', imports: [CommonModule, SvgIconComponent],
|
|
405
|
+
args: [{ selector: 'mz-alert', imports: [CommonModule, SvgIconComponent], template: "<div [className]=\"'alert alert-' + type\">\n\n <div>\n <div class=\"alert-icon\">\n <mz-svg-icon [key]=\"getAlertIcon()\" type=\"solid\"></mz-svg-icon>\n </div>\n\n <div class=\"alert-title\">\n <strong>{{ title }}</strong>\n </div>\n </div>\n\n <div class=\"alert-body\" *ngIf=\"body\">\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\n </div>\n\n <div class=\"alert-footer\" *ngIf=\"footer\">\n <ng-container *ngTemplateOutlet=\"footer\"></ng-container>\n </div>\n\n</div>" }]
|
|
406
406
|
}], ctorParameters: () => [], propDecorators: { title: [{
|
|
407
407
|
type: Input
|
|
408
408
|
}], type: [{
|
|
@@ -424,10 +424,10 @@ class PhoneNumberPipe {
|
|
|
424
424
|
}
|
|
425
425
|
return number;
|
|
426
426
|
}
|
|
427
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
428
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
427
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: PhoneNumberPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
428
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.8", ngImport: i0, type: PhoneNumberPipe, isStandalone: true, name: "mzPhoneNumber" }); }
|
|
429
429
|
}
|
|
430
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
430
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: PhoneNumberPipe, decorators: [{
|
|
431
431
|
type: Pipe,
|
|
432
432
|
args: [{
|
|
433
433
|
name: 'mzPhoneNumber',
|
|
@@ -455,10 +455,10 @@ class DateDisplayPipe {
|
|
|
455
455
|
}
|
|
456
456
|
return redefinedDate;
|
|
457
457
|
}
|
|
458
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
459
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
458
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DateDisplayPipe, deps: [{ token: i1.DatePipe }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
459
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.8", ngImport: i0, type: DateDisplayPipe, isStandalone: true, name: "mzDateDisplay" }); }
|
|
460
460
|
}
|
|
461
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
461
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DateDisplayPipe, decorators: [{
|
|
462
462
|
type: Pipe,
|
|
463
463
|
args: [{
|
|
464
464
|
name: 'mzDateDisplay',
|
|
@@ -481,10 +481,10 @@ class SortDirective {
|
|
|
481
481
|
setActiveHeaderSort() {
|
|
482
482
|
this.active = this._mzSort.includes('-') ? this._mzSort.slice(1) : this._mzSort;
|
|
483
483
|
}
|
|
484
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
485
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
484
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SortDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
485
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.8", type: SortDirective, isStandalone: true, selector: "[mzSort]", inputs: { mzSort: "mzSort" }, outputs: { sort: "sort" }, usesOnChanges: true, ngImport: i0 }); }
|
|
486
486
|
}
|
|
487
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
487
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SortDirective, decorators: [{
|
|
488
488
|
type: Directive,
|
|
489
489
|
args: [{
|
|
490
490
|
selector: '[mzSort]',
|
|
@@ -566,10 +566,10 @@ class SortKeyDirective {
|
|
|
566
566
|
setOrder(sort) {
|
|
567
567
|
this.order = sort.includes('-') ? 'desc' : 'asc';
|
|
568
568
|
}
|
|
569
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
570
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
569
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SortKeyDirective, deps: [{ token: SortDirective }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
570
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.8", type: SortKeyDirective, isStandalone: true, selector: "[mzSortKey]", inputs: { mzSortKey: "mzSortKey" }, host: { attributes: { "role": "button" }, listeners: { "click": "onClick()" }, properties: { "attr.aria-sort": "getAriaSortAttribute()" } }, ngImport: i0 }); }
|
|
571
571
|
}
|
|
572
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
572
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SortKeyDirective, decorators: [{
|
|
573
573
|
type: Directive,
|
|
574
574
|
args: [{
|
|
575
575
|
selector: '[mzSortKey]',
|
|
@@ -591,10 +591,10 @@ class SubjectDisplayPipe {
|
|
|
591
591
|
}
|
|
592
592
|
return subject.givenName && subject.familyName ? `${subject.givenName} ${subject.familyName}` : subject.userPrincipalName;
|
|
593
593
|
}
|
|
594
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
595
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
594
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SubjectDisplayPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
595
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.8", ngImport: i0, type: SubjectDisplayPipe, isStandalone: true, name: "mzSubjectDisplay" }); }
|
|
596
596
|
}
|
|
597
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
597
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: SubjectDisplayPipe, decorators: [{
|
|
598
598
|
type: Pipe,
|
|
599
599
|
args: [{
|
|
600
600
|
name: 'mzSubjectDisplay',
|
|
@@ -661,10 +661,10 @@ class ButtonDirective {
|
|
|
661
661
|
getOverlayDiv() {
|
|
662
662
|
return this.getChildElement('.button-loading-overlay');
|
|
663
663
|
}
|
|
664
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
665
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
664
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ButtonDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
665
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.8", type: ButtonDirective, isStandalone: true, selector: "[mzButton]", inputs: { variant: "variant", busy: "busy" }, host: { attributes: { "role": "button" }, properties: { "attr.tabindex": "0", "attr.aria-disabled": "busy", "class": "this.elementClass" } }, usesOnChanges: true, ngImport: i0 }); }
|
|
666
666
|
}
|
|
667
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
667
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: ButtonDirective, decorators: [{
|
|
668
668
|
type: Directive,
|
|
669
669
|
args: [{
|
|
670
670
|
selector: '[mzButton]',
|
|
@@ -697,12 +697,12 @@ class WizardProgressTrackerComponent {
|
|
|
697
697
|
toggle() {
|
|
698
698
|
this.toggled = !this.toggled;
|
|
699
699
|
}
|
|
700
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
701
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
700
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: WizardProgressTrackerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
701
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.8", type: WizardProgressTrackerComponent, isStandalone: true, selector: "mz-wizard-progress-tracker", inputs: { steps: "steps", currentStep: "currentStep" }, outputs: { stepChange: "stepChange" }, ngImport: i0, template: "<div class=\"wizard-progress-tracker\">\n <div class=\"direction-container\">\n <span class=\"steps-count\">Step {{ currentStep + 1 }} of {{ steps.length }}</span>\n <div class=\"wizard-steps-container\" [ngClass]=\"{'toggled': toggled}\">\n <div *ngFor=\"let step of steps; index as i;\" class=\"wizard-step\"\n [ngClass]=\"{ 'previous': i < currentStep, 'current': i === currentStep, 'unvisited': i > currentStep }\">\n <ng-container>\n <div class=\"wizard-step-icon-container\">\n <div class=\"spacer left\">\n </div>\n <div *ngIf=\"i > 0\" class=\"step-line left\"></div>\n\n <div *ngIf=\"i < currentStep\" class=\"wizard-step-icon\">\n <mz-svg-icon key=\"check-circle\" type=\"solid\">\n </mz-svg-icon>\n </div>\n <div *ngIf=\"i === currentStep\" class=\"wizard-step-icon\">\n <div class=\"step-inner-circle\"></div>\n </div>\n <div *ngIf=\"i > currentStep\" class=\"wizard-step-icon\">\n </div>\n\n <div *ngIf=\"i < (steps.length - 1)\" class=\"step-line step-line-right\"></div>\n <div class=\"spacer right\"></div>\n </div>\n <a *ngIf=\"i < currentStep\" class=\"step-desc\" (click)=\"goToStep(step)\"> {{\n step.name\n }}</a>\n <div *ngIf=\" i === currentStep\" class=\"step-desc\"> {{ step.name }}\n </div>\n <div *ngIf=\" i > currentStep\" class=\"step-desc\"> {{ step.name }}\n </div>\n <div class=\"toggable-icon\">\n <button *ngIf=\"!toggled\" (click)=\"toggle()\">\n <mz-svg-icon key=\"chevron-down\"></mz-svg-icon>\n </button>\n <button *ngIf=\"toggled\" (click)=\"toggle()\">\n <mz-svg-icon key=\"chevron-up\"></mz-svg-icon>\n </button>\n </div>\n </ng-container>\n </div>\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SvgIconComponent, selector: "mz-svg-icon", inputs: ["key", "type", "size"] }] }); }
|
|
702
702
|
}
|
|
703
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
703
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: WizardProgressTrackerComponent, decorators: [{
|
|
704
704
|
type: Component,
|
|
705
|
-
args: [{ selector: 'mz-wizard-progress-tracker',
|
|
705
|
+
args: [{ selector: 'mz-wizard-progress-tracker', imports: [CommonModule, SvgIconComponent], template: "<div class=\"wizard-progress-tracker\">\n <div class=\"direction-container\">\n <span class=\"steps-count\">Step {{ currentStep + 1 }} of {{ steps.length }}</span>\n <div class=\"wizard-steps-container\" [ngClass]=\"{'toggled': toggled}\">\n <div *ngFor=\"let step of steps; index as i;\" class=\"wizard-step\"\n [ngClass]=\"{ 'previous': i < currentStep, 'current': i === currentStep, 'unvisited': i > currentStep }\">\n <ng-container>\n <div class=\"wizard-step-icon-container\">\n <div class=\"spacer left\">\n </div>\n <div *ngIf=\"i > 0\" class=\"step-line left\"></div>\n\n <div *ngIf=\"i < currentStep\" class=\"wizard-step-icon\">\n <mz-svg-icon key=\"check-circle\" type=\"solid\">\n </mz-svg-icon>\n </div>\n <div *ngIf=\"i === currentStep\" class=\"wizard-step-icon\">\n <div class=\"step-inner-circle\"></div>\n </div>\n <div *ngIf=\"i > currentStep\" class=\"wizard-step-icon\">\n </div>\n\n <div *ngIf=\"i < (steps.length - 1)\" class=\"step-line step-line-right\"></div>\n <div class=\"spacer right\"></div>\n </div>\n <a *ngIf=\"i < currentStep\" class=\"step-desc\" (click)=\"goToStep(step)\"> {{\n step.name\n }}</a>\n <div *ngIf=\" i === currentStep\" class=\"step-desc\"> {{ step.name }}\n </div>\n <div *ngIf=\" i > currentStep\" class=\"step-desc\"> {{ step.name }}\n </div>\n <div class=\"toggable-icon\">\n <button *ngIf=\"!toggled\" (click)=\"toggle()\">\n <mz-svg-icon key=\"chevron-down\"></mz-svg-icon>\n </button>\n <button *ngIf=\"toggled\" (click)=\"toggle()\">\n <mz-svg-icon key=\"chevron-up\"></mz-svg-icon>\n </button>\n </div>\n </ng-container>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
706
706
|
}], propDecorators: { steps: [{
|
|
707
707
|
type: Input
|
|
708
708
|
}], currentStep: [{
|
|
@@ -814,8 +814,8 @@ class DateTimeComponent {
|
|
|
814
814
|
this.onChange(undefined);
|
|
815
815
|
}
|
|
816
816
|
}
|
|
817
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
818
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
817
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DateTimeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
818
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.8", type: DateTimeComponent, isStandalone: true, selector: "mz-datetime", inputs: { min: "min", max: "max", disabled: "disabled" }, providers: [
|
|
819
819
|
{
|
|
820
820
|
provide: NG_VALUE_ACCESSOR,
|
|
821
821
|
useExisting: forwardRef(() => DateTimeComponent),
|
|
@@ -823,7 +823,7 @@ class DateTimeComponent {
|
|
|
823
823
|
},
|
|
824
824
|
], viewQueries: [{ propertyName: "datepicker", first: true, predicate: ["datePicker"], descendants: true }], ngImport: i0, template: "<div class=\"flex\">\n <div class=\"field-control-combo\">\n <input class=\"field-control\" type=\"text\" [value]=\"date\" (change)=\"updateDate($event)\" [min]=\"min\" [max]=\"max\"\n [matDatepicker]=\"datePicker\" (dateChange)=\"updateDateEvent($event)\" [disabled]=\"disabled\" ngDefaultControl>\n <div class=\"field-control-addon\">\n <button class=\"button button-secondary button-icon\" type=\"button\" (click)=\"datePicker.open()\"\n [disabled]=\"disabled\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\n stroke-width=\"2\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z\" />\n </svg>\n </button>\n <mat-datepicker #datePicker></mat-datepicker>\n </div>\n </div>\n <div class=\"field-control-group mt-1 ml-6\">\n <input class=\"field-control\" type=\"time\" [value]=\"time\" (change)=\"updateTime($event)\"\n ngDefaultControl [disabled]=\"disabled\">\n </div>\n</div>\n", styles: ["input:disabled,button:disabled{opacity:.6}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i1$3.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i1$3.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }] }); }
|
|
825
825
|
}
|
|
826
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
826
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DateTimeComponent, decorators: [{
|
|
827
827
|
type: Component,
|
|
828
828
|
args: [{ selector: 'mz-datetime', providers: [
|
|
829
829
|
{
|
|
@@ -831,7 +831,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImpor
|
|
|
831
831
|
useExisting: forwardRef(() => DateTimeComponent),
|
|
832
832
|
multi: true,
|
|
833
833
|
},
|
|
834
|
-
], imports: [CommonModule, MatDatepickerModule],
|
|
834
|
+
], imports: [CommonModule, MatDatepickerModule], template: "<div class=\"flex\">\n <div class=\"field-control-combo\">\n <input class=\"field-control\" type=\"text\" [value]=\"date\" (change)=\"updateDate($event)\" [min]=\"min\" [max]=\"max\"\n [matDatepicker]=\"datePicker\" (dateChange)=\"updateDateEvent($event)\" [disabled]=\"disabled\" ngDefaultControl>\n <div class=\"field-control-addon\">\n <button class=\"button button-secondary button-icon\" type=\"button\" (click)=\"datePicker.open()\"\n [disabled]=\"disabled\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"\n stroke-width=\"2\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z\" />\n </svg>\n </button>\n <mat-datepicker #datePicker></mat-datepicker>\n </div>\n </div>\n <div class=\"field-control-group mt-1 ml-6\">\n <input class=\"field-control\" type=\"time\" [value]=\"time\" (change)=\"updateTime($event)\"\n ngDefaultControl [disabled]=\"disabled\">\n </div>\n</div>\n", styles: ["input:disabled,button:disabled{opacity:.6}\n"] }]
|
|
835
835
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { datepicker: [{
|
|
836
836
|
type: ViewChild,
|
|
837
837
|
args: ['datePicker']
|
|
@@ -857,14 +857,14 @@ class TimeValueValidatorDirective {
|
|
|
857
857
|
}*/
|
|
858
858
|
return null;
|
|
859
859
|
}
|
|
860
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
861
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
860
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: TimeValueValidatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
861
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.8", type: TimeValueValidatorDirective, isStandalone: true, selector: "input[type=time]", providers: [{
|
|
862
862
|
provide: NG_VALIDATORS,
|
|
863
863
|
useExisting: TimeValueValidatorDirective,
|
|
864
864
|
multi: true
|
|
865
865
|
}], ngImport: i0 }); }
|
|
866
866
|
}
|
|
867
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
867
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: TimeValueValidatorDirective, decorators: [{
|
|
868
868
|
type: Directive,
|
|
869
869
|
args: [{
|
|
870
870
|
selector: 'input[type=time]',
|
|
@@ -896,12 +896,12 @@ class InfiniteScrollComponent {
|
|
|
896
896
|
this.selectedItem = item;
|
|
897
897
|
this.itemSelected.emit(item);
|
|
898
898
|
}
|
|
899
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
900
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
899
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: InfiniteScrollComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
900
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.8", type: InfiniteScrollComponent, isStandalone: true, selector: "mz-infinite-scroll", inputs: { items: "items", isLoading: "isLoading", containerHeight: "containerHeight" }, outputs: { itemSelected: "itemSelected", loadMore: "loadMore" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: ["itemTemplate"], descendants: true }], ngImport: i0, template: "<div class=\"infinite-scroll-container overflow-auto\" [style.height]=\"containerHeight\" (scroll)=\"onContainerScroll($event)\">\n <ng-container *ngIf=\"itemTemplate; else defaultItems\">\n <ng-container *ngFor=\"let item of items\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n </ng-container>\n </ng-container>\n <ng-template #defaultItems>\n <div *ngFor=\"let item of items\" class=\"scroll-item\" [ngClass]=\"{'scroll-item-selected': selectedItem === item}\" (click)=\"onItemClick(item)\">\n {{ item.label }}\n </div>\n </ng-template>\n\n <!-- Spinner -->\n <div *ngIf=\"isLoading\" class=\"scroll-spinner-container\">\n <mz-spinner size=\"medium\" type=\"secondary\"></mz-spinner>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SpinnerComponent, selector: "mz-spinner", inputs: ["size", "type"] }] }); }
|
|
901
901
|
}
|
|
902
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
902
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: InfiniteScrollComponent, decorators: [{
|
|
903
903
|
type: Component,
|
|
904
|
-
args: [{ selector: 'mz-infinite-scroll',
|
|
904
|
+
args: [{ selector: 'mz-infinite-scroll', imports: [CommonModule, SpinnerComponent], template: "<div class=\"infinite-scroll-container overflow-auto\" [style.height]=\"containerHeight\" (scroll)=\"onContainerScroll($event)\">\n <ng-container *ngIf=\"itemTemplate; else defaultItems\">\n <ng-container *ngFor=\"let item of items\">\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n </ng-container>\n </ng-container>\n <ng-template #defaultItems>\n <div *ngFor=\"let item of items\" class=\"scroll-item\" [ngClass]=\"{'scroll-item-selected': selectedItem === item}\" (click)=\"onItemClick(item)\">\n {{ item.label }}\n </div>\n </ng-template>\n\n <!-- Spinner -->\n <div *ngIf=\"isLoading\" class=\"scroll-spinner-container\">\n <mz-spinner size=\"medium\" type=\"secondary\"></mz-spinner>\n </div>\n</div>\n" }]
|
|
905
905
|
}], propDecorators: { items: [{
|
|
906
906
|
type: Input
|
|
907
907
|
}], isLoading: [{
|
|
@@ -918,8 +918,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImpor
|
|
|
918
918
|
}] } });
|
|
919
919
|
|
|
920
920
|
class MuziehComponentsModule {
|
|
921
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
922
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
921
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MuziehComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
922
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.8", ngImport: i0, type: MuziehComponentsModule, imports: [CommonModule,
|
|
923
923
|
FormsModule,
|
|
924
924
|
ButtonDirective,
|
|
925
925
|
SvgIconComponent,
|
|
@@ -958,7 +958,7 @@ class MuziehComponentsModule {
|
|
|
958
958
|
WizardProgressTrackerComponent,
|
|
959
959
|
DateTimeComponent,
|
|
960
960
|
TimeValueValidatorDirective] }); }
|
|
961
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
961
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MuziehComponentsModule, providers: [
|
|
962
962
|
DatePipe,
|
|
963
963
|
], imports: [CommonModule,
|
|
964
964
|
FormsModule,
|
|
@@ -971,7 +971,7 @@ class MuziehComponentsModule {
|
|
|
971
971
|
PageLoadingIndicatorComponent,
|
|
972
972
|
DateTimeComponent] }); }
|
|
973
973
|
}
|
|
974
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
974
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MuziehComponentsModule, decorators: [{
|
|
975
975
|
type: NgModule,
|
|
976
976
|
args: [{
|
|
977
977
|
imports: [
|
|
@@ -1053,10 +1053,10 @@ class MzDatePipe extends DatePipe {
|
|
|
1053
1053
|
}
|
|
1054
1054
|
return super.transform(value, translatedFormat, translatedTimezone, locale);
|
|
1055
1055
|
}
|
|
1056
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1057
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
1056
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDatePipe, deps: [{ token: LOCALE_ID }, { token: MZ_DATE_PIPE_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
1057
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.8", ngImport: i0, type: MzDatePipe, isStandalone: true, name: "mzDate" }); }
|
|
1058
1058
|
}
|
|
1059
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1059
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDatePipe, decorators: [{
|
|
1060
1060
|
type: Pipe,
|
|
1061
1061
|
args: [{
|
|
1062
1062
|
name: 'mzDate',
|
|
@@ -1110,12 +1110,12 @@ class MzInlineEditComponent {
|
|
|
1110
1110
|
this.isEditing = false;
|
|
1111
1111
|
this.busy = false;
|
|
1112
1112
|
}
|
|
1113
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1114
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1113
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzInlineEditComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1114
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: MzInlineEditComponent, isStandalone: true, selector: "mz-inline-edit", inputs: { label: "label", layout: "layout" }, outputs: { save: "save" }, queries: [{ propertyName: "ngModel", first: true, predicate: NgModel, descendants: true }, { propertyName: "ngModelElement", first: true, predicate: NgModel, descendants: true, read: ElementRef }], ngImport: i0, template: "<form class=\"mz-inline-edit\" [ngClass]=\"{ 'horizontal': layout === 'horizontal', 'vertical': layout === 'vertical' }\">\n @if (isEditing || !label) {\n <ng-content></ng-content>\n } @else if (label && !isEditing) {\n <button type=\"button\" class=\"label-button\" (click)=\"activate()\">\n <span>\n {{ label }}\n </span>\n <span class=\"text-secondary label-button-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M21.731 2.269a2.625 2.625 0 0 0-3.712 0l-1.157 1.157 3.712 3.712 1.157-1.157a2.625 2.625 0 0 0 0-3.712ZM19.513 8.199l-3.712-3.712-12.15 12.15a5.25 5.25 0 0 0-1.32 2.214l-.8 2.685a.75.75 0 0 0 .933.933l2.685-.8a5.25 5.25 0 0 0 2.214-1.32L19.513 8.2Z\" />\n </svg>\n </span>\n </button>\n } @if (isEditing) {\n <div class=\"edit-buttons\">\n <button type=\"submit\" mzButton [busy]=\"busy\" (click)=\"submitForm()\">Save</button>\n <button type=\"button\" class=\"button button-tertiary\" (click)=\"cancelEdit()\">Cancel</button>\n <!--<button mzButton [busy]=\"busy\" type=\"submit\" (click)=\"submitForm()\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </button>\n <button type=\"button\" mzButton variant=\"tertiary\" (click)=\"cancelEdit()\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n <path fill-rule=\"evenodd\" d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\" clip-rule=\"evenodd\" />\n </svg>\n </button>-->\n </div>\n }\n</form>\n", styles: [".mz-inline-edit{display:flex}.mz-inline-edit.horizontal{flex-direction:row;gap:1rem}.mz-inline-edit.vertical{flex-direction:column;gap:.5rem}.label-button{display:flex;gap:1rem;cursor:pointer}.label-button-icon{width:1rem;height:1rem}.edit-buttons{display:flex;gap:.5rem}\n"], dependencies: [{ kind: "directive", type: ButtonDirective, selector: "[mzButton]", inputs: ["variant", "busy"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
1115
1115
|
}
|
|
1116
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1116
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzInlineEditComponent, decorators: [{
|
|
1117
1117
|
type: Component,
|
|
1118
|
-
args: [{ selector: 'mz-inline-edit',
|
|
1118
|
+
args: [{ selector: 'mz-inline-edit', imports: [ButtonDirective, FormsModule, CommonModule], template: "<form class=\"mz-inline-edit\" [ngClass]=\"{ 'horizontal': layout === 'horizontal', 'vertical': layout === 'vertical' }\">\n @if (isEditing || !label) {\n <ng-content></ng-content>\n } @else if (label && !isEditing) {\n <button type=\"button\" class=\"label-button\" (click)=\"activate()\">\n <span>\n {{ label }}\n </span>\n <span class=\"text-secondary label-button-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M21.731 2.269a2.625 2.625 0 0 0-3.712 0l-1.157 1.157 3.712 3.712 1.157-1.157a2.625 2.625 0 0 0 0-3.712ZM19.513 8.199l-3.712-3.712-12.15 12.15a5.25 5.25 0 0 0-1.32 2.214l-.8 2.685a.75.75 0 0 0 .933.933l2.685-.8a5.25 5.25 0 0 0 2.214-1.32L19.513 8.2Z\" />\n </svg>\n </span>\n </button>\n } @if (isEditing) {\n <div class=\"edit-buttons\">\n <button type=\"submit\" mzButton [busy]=\"busy\" (click)=\"submitForm()\">Save</button>\n <button type=\"button\" class=\"button button-tertiary\" (click)=\"cancelEdit()\">Cancel</button>\n <!--<button mzButton [busy]=\"busy\" type=\"submit\" (click)=\"submitForm()\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\" />\n </svg>\n </button>\n <button type=\"button\" mzButton variant=\"tertiary\" (click)=\"cancelEdit()\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"h-5 w-5\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n <path fill-rule=\"evenodd\" d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\" clip-rule=\"evenodd\" />\n </svg>\n </button>-->\n </div>\n }\n</form>\n", styles: [".mz-inline-edit{display:flex}.mz-inline-edit.horizontal{flex-direction:row;gap:1rem}.mz-inline-edit.vertical{flex-direction:column;gap:.5rem}.label-button{display:flex;gap:1rem;cursor:pointer}.label-button-icon{width:1rem;height:1rem}.edit-buttons{display:flex;gap:.5rem}\n"] }]
|
|
1119
1119
|
}], ctorParameters: () => [{ type: i0.Renderer2 }], propDecorators: { label: [{
|
|
1120
1120
|
type: Input
|
|
1121
1121
|
}], layout: [{
|
|
@@ -1277,12 +1277,12 @@ class DrawerContainerComponent extends CdkDialogContainer {
|
|
|
1277
1277
|
enter() {
|
|
1278
1278
|
this.open = true;
|
|
1279
1279
|
}
|
|
1280
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1281
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1280
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DrawerContainerComponent, deps: [{ token: i0.ElementRef }, { token: i1$5.FocusTrapFactory }, { token: MzDialogConfig }, { token: i1$5.InteractivityChecker }, { token: i0.NgZone }, { token: i3.OverlayRef }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1281
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: DrawerContainerComponent, isStandalone: true, selector: "mz-drawer-container", host: { listeners: { "window:beforeunload": "onBeforeUnload($event)" }, properties: { "class.open": "open" }, classAttribute: "mz-dialog-container" }, usesInheritance: true, ngImport: i0, template: "<article class=\"mz-dialog\">\n <ng-template cdkPortalOutlet />\n\n @if(!dialogConfig.disableClose) {\n <button class=\"button-close\" (click)=\"tryClose($event)\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18 18 6M6 6l12 12\" />\n </svg>\n </button>\n }\n</article>\n", styles: [":host(.mz-dialog-container){background-color:var(--surface-bg);width:500px;max-width:90%;position:absolute;right:0;top:0;height:100vh;transition:translate .3s ease-out;translate:100%}:host(.mz-dialog-container).open{translate:0%}.button-close{height:1.5rem;width:1.5rem;display:inline-block;position:absolute;top:1rem;right:1.5rem;z-index:10}.mz-dialog{height:100%;position:relative;overflow:auto}\n"], dependencies: [{ kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }] }); }
|
|
1282
1282
|
}
|
|
1283
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1283
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: DrawerContainerComponent, decorators: [{
|
|
1284
1284
|
type: Component,
|
|
1285
|
-
args: [{ selector: 'mz-drawer-container',
|
|
1285
|
+
args: [{ selector: 'mz-drawer-container', imports: [CdkPortalOutlet], host: {
|
|
1286
1286
|
'class': 'mz-dialog-container',
|
|
1287
1287
|
'[class.open]': 'open'
|
|
1288
1288
|
}, template: "<article class=\"mz-dialog\">\n <ng-template cdkPortalOutlet />\n\n @if(!dialogConfig.disableClose) {\n <button class=\"button-close\" (click)=\"tryClose($event)\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18 18 6M6 6l12 12\" />\n </svg>\n </button>\n }\n</article>\n", styles: [":host(.mz-dialog-container){background-color:var(--surface-bg);width:500px;max-width:90%;position:absolute;right:0;top:0;height:100vh;transition:translate .3s ease-out;translate:100%}:host(.mz-dialog-container).open{translate:0%}.button-close{height:1.5rem;width:1.5rem;display:inline-block;position:absolute;top:1rem;right:1.5rem;z-index:10}.mz-dialog{height:100%;position:relative;overflow:auto}\n"] }]
|
|
@@ -1445,10 +1445,10 @@ class MzDialog {
|
|
|
1445
1445
|
dialogs[i].close();
|
|
1446
1446
|
}
|
|
1447
1447
|
}
|
|
1448
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1449
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1448
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDialog, deps: [{ token: i0.Injector }, { token: i3.Overlay }, { token: DEFAULT_MZ_DIALOG_CONFIG, optional: true }, { token: i0.ViewContainerRef, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1449
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDialog, providedIn: 'root' }); }
|
|
1450
1450
|
}
|
|
1451
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1451
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDialog, decorators: [{
|
|
1452
1452
|
type: Injectable,
|
|
1453
1453
|
args: [{
|
|
1454
1454
|
providedIn: 'root',
|
|
@@ -1463,12 +1463,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImpor
|
|
|
1463
1463
|
}] }] });
|
|
1464
1464
|
|
|
1465
1465
|
class MzDialogModule {
|
|
1466
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1467
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1466
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1467
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.8", ngImport: i0, type: MzDialogModule, imports: [DialogModule, OverlayModule, PortalModule, DrawerContainerComponent], exports: [DialogModule,
|
|
1468
1468
|
DrawerContainerComponent] }); }
|
|
1469
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1469
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDialogModule, providers: [MzDialog], imports: [DialogModule, OverlayModule, PortalModule, DialogModule] }); }
|
|
1470
1470
|
}
|
|
1471
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1471
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDialogModule, decorators: [{
|
|
1472
1472
|
type: NgModule,
|
|
1473
1473
|
args: [{
|
|
1474
1474
|
imports: [DialogModule, OverlayModule, PortalModule, DrawerContainerComponent],
|
|
@@ -1491,12 +1491,12 @@ class MzDropdownComponent {
|
|
|
1491
1491
|
collapse() {
|
|
1492
1492
|
this.open = false;
|
|
1493
1493
|
}
|
|
1494
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1495
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1494
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1495
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.8", type: MzDropdownComponent, isStandalone: true, selector: "mz-dropdown", inputs: { label: "label", open: "open" }, ngImport: i0, template: "<button cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\" (click)=\"toggle()\" class=\"button button-secondary\" [class.active]=\"open\">\n {{ label }}\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\" class=\"mz-dropdown-icon\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n</button>\n<ng-template \n cdkConnectedOverlay [cdkConnectedOverlayOrigin]=\"trigger\" [cdkConnectedOverlayOpen]=\"open\" (overlayOutsideClick)=\"collapse()\" (detach)=\"collapse()\">\n <div cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\" class=\"mz-dropdown-body\">\n <ng-content></ng-content>\n </div>\n</ng-template>", styles: [".mz-dropdown-icon{height:1.5rem;width:1.5rem;display:inline-block;padding-left:.5rem}.mz-dropdown-body{background-color:var(--surface-bg);min-width:5rem;margin-top:.25rem;padding:.75rem;border-radius:var(--surface-border-radius);--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1) !important;--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color) !important;box-shadow:var(--tw-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)),var(--tw-ring-shadow, 0 0 rgba(0, 0, 0, 0)),var(--tw-shadow)!important}.mz-dropdown-item{display:block;width:100%;padding:.5rem;font-size:.875rem;line-height:1.25rem;text-align:left;border-radius:var(--button-border-radius)}.mz-dropdown-item:hover{background-color:var(--color-neutral-200)}\n"], dependencies: [{ kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1496
1496
|
}
|
|
1497
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1497
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDropdownComponent, decorators: [{
|
|
1498
1498
|
type: Component,
|
|
1499
|
-
args: [{ selector: 'mz-dropdown',
|
|
1499
|
+
args: [{ selector: 'mz-dropdown', imports: [CdkOverlayOrigin, CdkConnectedOverlay, CdkTrapFocus], encapsulation: ViewEncapsulation.None, template: "<button cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\" (click)=\"toggle()\" class=\"button button-secondary\" [class.active]=\"open\">\n {{ label }}\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\" class=\"mz-dropdown-icon\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n</button>\n<ng-template \n cdkConnectedOverlay [cdkConnectedOverlayOrigin]=\"trigger\" [cdkConnectedOverlayOpen]=\"open\" (overlayOutsideClick)=\"collapse()\" (detach)=\"collapse()\">\n <div cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\" class=\"mz-dropdown-body\">\n <ng-content></ng-content>\n </div>\n</ng-template>", styles: [".mz-dropdown-icon{height:1.5rem;width:1.5rem;display:inline-block;padding-left:.5rem}.mz-dropdown-body{background-color:var(--surface-bg);min-width:5rem;margin-top:.25rem;padding:.75rem;border-radius:var(--surface-border-radius);--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1) !important;--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color) !important;box-shadow:var(--tw-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)),var(--tw-ring-shadow, 0 0 rgba(0, 0, 0, 0)),var(--tw-shadow)!important}.mz-dropdown-item{display:block;width:100%;padding:.5rem;font-size:.875rem;line-height:1.25rem;text-align:left;border-radius:var(--button-border-radius)}.mz-dropdown-item:hover{background-color:var(--color-neutral-200)}\n"] }]
|
|
1500
1500
|
}], propDecorators: { label: [{
|
|
1501
1501
|
type: Input
|
|
1502
1502
|
}], open: [{
|
|
@@ -1510,10 +1510,10 @@ class MzDropdownItemDirective {
|
|
|
1510
1510
|
close() {
|
|
1511
1511
|
this.dropdown.collapse();
|
|
1512
1512
|
}
|
|
1513
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1514
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1513
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDropdownItemDirective, deps: [{ token: MzDropdownComponent, host: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1514
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.8", type: MzDropdownItemDirective, isStandalone: true, selector: "[mzDropdownItem]", host: { listeners: { "click": "close()" }, classAttribute: "mz-dropdown-item" }, ngImport: i0 }); }
|
|
1515
1515
|
}
|
|
1516
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1516
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDropdownItemDirective, decorators: [{
|
|
1517
1517
|
type: Directive,
|
|
1518
1518
|
args: [{
|
|
1519
1519
|
selector: '[mzDropdownItem]',
|
|
@@ -1528,11 +1528,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.1", ngImpor
|
|
|
1528
1528
|
}] }] });
|
|
1529
1529
|
|
|
1530
1530
|
class MzDropdownModule {
|
|
1531
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1532
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1533
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1531
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1532
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.8", ngImport: i0, type: MzDropdownModule, imports: [MzDropdownComponent, MzDropdownItemDirective], exports: [MzDropdownComponent, MzDropdownItemDirective] }); }
|
|
1533
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDropdownModule }); }
|
|
1534
1534
|
}
|
|
1535
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1535
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: MzDropdownModule, decorators: [{
|
|
1536
1536
|
type: NgModule,
|
|
1537
1537
|
args: [{
|
|
1538
1538
|
imports: [MzDropdownComponent, MzDropdownItemDirective],
|
|
@@ -1564,12 +1564,12 @@ class FilterComponent {
|
|
|
1564
1564
|
this.open = false;
|
|
1565
1565
|
console.log('applied', this.menuForm.value);
|
|
1566
1566
|
}
|
|
1567
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1568
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1567
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: FilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1568
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: FilterComponent, isStandalone: true, selector: "mz-filter", inputs: { label: "label" }, queries: [{ propertyName: "menuForm", first: true, predicate: NgForm, descendants: true }], ngImport: i0, template: "<button cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\" (click)=\"toggleOverlay()\" class=\"button button-secondary\" [class.active]=\"open\">\n {{ label }}\n <span class=\"dropdown-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\" class=\"dropdown-icon\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n </span>\n</button>\n<ng-template \n cdkConnectedOverlay [cdkConnectedOverlayOrigin]=\"trigger\" [cdkConnectedOverlayOpen]=\"open\" [cdkConnectedOverlayPanelClass]=\"'dropdown-body'\" (overlayOutsideClick)=\"dismiss()\">\n <div>\n <ng-content></ng-content>\n\n <div class=\"dropdown-buttons\">\n @if(menuForm.options.updateOn === 'submit') {\n <button type=\"button\" class=\"button button-primary\" (click)=\"apply()\">Apply</button>\n }\n <button type=\"button\" class=\"button button-tertiary\" (click)=\"clear()\">Clear</button>\n </div>\n </div>\n</ng-template>\n", styles: [".dropdown-body{background-color:var(--surface-bg, white);min-width:5rem;margin-top:.25rem;padding:.75rem}.dropdown-buttons{display:flex;margin-top:.25rem}.dropdown-icon{height:1.5rem;width:1.5rem;display:inline-block}\n"], dependencies: [{ kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }] }); }
|
|
1569
1569
|
}
|
|
1570
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1570
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: FilterComponent, decorators: [{
|
|
1571
1571
|
type: Component,
|
|
1572
|
-
args: [{ selector: 'mz-filter',
|
|
1572
|
+
args: [{ selector: 'mz-filter', imports: [CdkOverlayOrigin, CdkConnectedOverlay, FormsModule, CommonModule], template: "<button cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\" (click)=\"toggleOverlay()\" class=\"button button-secondary\" [class.active]=\"open\">\n {{ label }}\n <span class=\"dropdown-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\" class=\"dropdown-icon\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n </span>\n</button>\n<ng-template \n cdkConnectedOverlay [cdkConnectedOverlayOrigin]=\"trigger\" [cdkConnectedOverlayOpen]=\"open\" [cdkConnectedOverlayPanelClass]=\"'dropdown-body'\" (overlayOutsideClick)=\"dismiss()\">\n <div>\n <ng-content></ng-content>\n\n <div class=\"dropdown-buttons\">\n @if(menuForm.options.updateOn === 'submit') {\n <button type=\"button\" class=\"button button-primary\" (click)=\"apply()\">Apply</button>\n }\n <button type=\"button\" class=\"button button-tertiary\" (click)=\"clear()\">Clear</button>\n </div>\n </div>\n</ng-template>\n", styles: [".dropdown-body{background-color:var(--surface-bg, white);min-width:5rem;margin-top:.25rem;padding:.75rem}.dropdown-buttons{display:flex;margin-top:.25rem}.dropdown-icon{height:1.5rem;width:1.5rem;display:inline-block}\n"] }]
|
|
1573
1573
|
}], propDecorators: { label: [{
|
|
1574
1574
|
type: Input
|
|
1575
1575
|
}], menuForm: [{
|
|
@@ -1616,12 +1616,12 @@ class OptionsFilterComponent {
|
|
|
1616
1616
|
dismiss() {
|
|
1617
1617
|
this.open = false;
|
|
1618
1618
|
}
|
|
1619
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1620
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1619
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: OptionsFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1620
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.8", type: OptionsFilterComponent, isStandalone: true, selector: "mz-options-filter", inputs: { options: "options", values: "values", label: "label", selected: "selected" }, outputs: { change: "change" }, viewQueries: [{ propertyName: "form", first: true, predicate: NgForm, descendants: true }], ngImport: i0, template: "<button cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\" (click)=\"toggleOverlay()\" class=\"button button-secondary\" [class.active]=\"open\">\n @if (options) {\n {{ filterLabel }}\n <span class=\"dropdown-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\" class=\"dropdown-icon\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n </span>\n } @else {\n <mz-spinner></mz-spinner>\n }\n</button>\n<ng-template \n cdkConnectedOverlay [cdkConnectedOverlayOrigin]=\"trigger\" [cdkConnectedOverlayOpen]=\"open\" [cdkConnectedOverlayPanelClass]=\"'dropdown-body'\" (overlayOutsideClick)=\"dismiss()\">\n <div>\n <form #myForm=\"ngForm\" > \n <div>\n <label class=\"field\">\n <input type=\"text\" [(ngModel)]=\"search\" placeholder=\"Search...\" name=\"search\" class=\"form-input\" autocomplete=\"off\" />\n </label>\n <div class=\"dropdown-options\">\n @for(option of filteredOptions; track option.value) {\n <label class=\"field-option\" [class.active]=\"selected === option.value\">\n <input class=\"form-radio\" type=\"radio\" [(ngModel)]=\"selected\" name=\"option\" [value]=\"option.value\" (ngModelChange)=\"apply()\"/>\n <span class=\"radio-label\">{{ option.label }}</span>\n </label>\n }\n </div>\n </div>\n <div class=\"dropdown-buttons\">\n <button type=\"button\" class=\"button button-tertiary\" (click)=\"clear()\">Clear</button>\n </div>\n </form>\n </div>\n</ng-template>\n", styles: [".dropdown-icon{height:1.5rem;width:1.5rem;display:inline-block;padding-left:.5rem}.dropdown-body{background-color:var(--surface-bg);min-width:5rem;margin-top:.25rem;padding:.75rem;border-radius:var(--surface-border-radius);--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1) !important;--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color) !important;box-shadow:var(--tw-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)),var(--tw-ring-shadow, 0 0 rgba(0, 0, 0, 0)),var(--tw-shadow)!important}.dropdown-buttons{display:flex;margin-top:.25rem}.dropdown-options{max-height:15rem;overflow-y:auto}.dropdown-options{display:inline-flex;flex-direction:column;width:100%;gap:.25rem}.dropdown-options .field-option{display:inline-flex;position:relative;padding-top:.625rem;padding-bottom:.625rem;gap:.25rem;align-items:center;font-size:.875rem;line-height:1.25rem;font-weight:500;background-color:transparent;border-radius:var(--button-border-radius);cursor:pointer}.dropdown-options .field-option:hover{background-color:var(--color-neutral-200)}.dropdown-options .field-option.active{background-color:color-mix(in srgb,var(--color-neutral-400, #000) 65%,transparent)}.dropdown-options .field-option input[type=radio]{display:none}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$4.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: i1$4.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$4.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "component", type: SpinnerComponent, selector: "mz-spinner", inputs: ["size", "type"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1621
1621
|
}
|
|
1622
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1622
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImport: i0, type: OptionsFilterComponent, decorators: [{
|
|
1623
1623
|
type: Component,
|
|
1624
|
-
args: [{ selector: 'mz-options-filter',
|
|
1624
|
+
args: [{ selector: 'mz-options-filter', imports: [FormsModule, CdkOverlayOrigin, CdkConnectedOverlay, SpinnerComponent], encapsulation: ViewEncapsulation.None, template: "<button cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\" (click)=\"toggleOverlay()\" class=\"button button-secondary\" [class.active]=\"open\">\n @if (options) {\n {{ filterLabel }}\n <span class=\"dropdown-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\" class=\"dropdown-icon\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n </span>\n } @else {\n <mz-spinner></mz-spinner>\n }\n</button>\n<ng-template \n cdkConnectedOverlay [cdkConnectedOverlayOrigin]=\"trigger\" [cdkConnectedOverlayOpen]=\"open\" [cdkConnectedOverlayPanelClass]=\"'dropdown-body'\" (overlayOutsideClick)=\"dismiss()\">\n <div>\n <form #myForm=\"ngForm\" > \n <div>\n <label class=\"field\">\n <input type=\"text\" [(ngModel)]=\"search\" placeholder=\"Search...\" name=\"search\" class=\"form-input\" autocomplete=\"off\" />\n </label>\n <div class=\"dropdown-options\">\n @for(option of filteredOptions; track option.value) {\n <label class=\"field-option\" [class.active]=\"selected === option.value\">\n <input class=\"form-radio\" type=\"radio\" [(ngModel)]=\"selected\" name=\"option\" [value]=\"option.value\" (ngModelChange)=\"apply()\"/>\n <span class=\"radio-label\">{{ option.label }}</span>\n </label>\n }\n </div>\n </div>\n <div class=\"dropdown-buttons\">\n <button type=\"button\" class=\"button button-tertiary\" (click)=\"clear()\">Clear</button>\n </div>\n </form>\n </div>\n</ng-template>\n", styles: [".dropdown-icon{height:1.5rem;width:1.5rem;display:inline-block;padding-left:.5rem}.dropdown-body{background-color:var(--surface-bg);min-width:5rem;margin-top:.25rem;padding:.75rem;border-radius:var(--surface-border-radius);--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1) !important;--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color) !important;box-shadow:var(--tw-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)),var(--tw-ring-shadow, 0 0 rgba(0, 0, 0, 0)),var(--tw-shadow)!important}.dropdown-buttons{display:flex;margin-top:.25rem}.dropdown-options{max-height:15rem;overflow-y:auto}.dropdown-options{display:inline-flex;flex-direction:column;width:100%;gap:.25rem}.dropdown-options .field-option{display:inline-flex;position:relative;padding-top:.625rem;padding-bottom:.625rem;gap:.25rem;align-items:center;font-size:.875rem;line-height:1.25rem;font-weight:500;background-color:transparent;border-radius:var(--button-border-radius);cursor:pointer}.dropdown-options .field-option:hover{background-color:var(--color-neutral-200)}.dropdown-options .field-option.active{background-color:color-mix(in srgb,var(--color-neutral-400, #000) 65%,transparent)}.dropdown-options .field-option input[type=radio]{display:none}\n"] }]
|
|
1625
1625
|
}], propDecorators: { options: [{
|
|
1626
1626
|
type: Input
|
|
1627
1627
|
}], values: [{
|