@muziehdesign/components 19.2.2667 → 20.0.0-beta.2683
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 +122 -122
- package/fesm2022/muziehdesign-components.mjs.map +1 -1
- package/index.d.ts +735 -3
- package/package.json +4 -4
- package/lib/alert/alert.component.d.ts +0 -14
- package/lib/button/button-appearance.d.ts +0 -1
- package/lib/button/button.component.d.ts +0 -12
- package/lib/button.directive.d.ts +0 -24
- package/lib/components.module.d.ts +0 -27
- package/lib/date-display/date-display-config.d.ts +0 -10
- package/lib/date-display/date-display.pipe.d.ts +0 -13
- package/lib/date-display/date.pipe.d.ts +0 -12
- package/lib/dialog/dialog-appearance.d.ts +0 -1
- package/lib/dialog/dialog-config.d.ts +0 -42
- package/lib/dialog/dialog-container/dialog-container.component.d.ts +0 -17
- package/lib/dialog/dialog-content/dialog-content.component.d.ts +0 -5
- package/lib/dialog/dialog-footer/dialog-footer.component.d.ts +0 -5
- package/lib/dialog/dialog-header/dialog-header.component.d.ts +0 -7
- package/lib/dialog/dialog.d.ts +0 -36
- package/lib/dialog/dialog.module.d.ts +0 -13
- package/lib/dialog/message-dialog/message-dialog-data.d.ts +0 -8
- package/lib/dialog/message-dialog/message-dialog.component.d.ts +0 -12
- package/lib/drawer/container/drawer-container.component.d.ts +0 -22
- package/lib/drawer/drawer-config.d.ts +0 -86
- package/lib/drawer/drawer-content/drawer-content.component.d.ts +0 -5
- package/lib/drawer/drawer-footer/drawer-footer.component.d.ts +0 -5
- package/lib/drawer/drawer-header/drawer-header.component.d.ts +0 -11
- package/lib/drawer/drawer-injectors.d.ts +0 -5
- package/lib/drawer/drawer-ref.d.ts +0 -30
- package/lib/drawer/drawer.d.ts +0 -39
- package/lib/drawer/drawer.module.d.ts +0 -13
- package/lib/enum-display/enum-display.pipe.d.ts +0 -9
- package/lib/filter/filter-menu/filter-menu.component.d.ts +0 -18
- package/lib/filter/filter-option.model.d.ts +0 -5
- package/lib/filter/filter.component.d.ts +0 -19
- package/lib/guard-deactivate.d.ts +0 -11
- package/lib/infinite-scroll/infinite-scroll.component.d.ts +0 -15
- package/lib/inline-edit/inline-edit.component.d.ts +0 -22
- package/lib/models/loading-state.d.ts +0 -4
- package/lib/models/page-event.d.ts +0 -4
- package/lib/models/result-table-options.d.ts +0 -4
- package/lib/models/sort-event.d.ts +0 -3
- package/lib/models/subject.d.ts +0 -7
- package/lib/models/wizard-step-link.d.ts +0 -4
- package/lib/options-filter/options-filter.component.d.ts +0 -27
- package/lib/page-header/page-header.component.d.ts +0 -13
- package/lib/page-loading-indicator/page-loading-indicator.component.d.ts +0 -12
- package/lib/pagination/pagination-config.d.ts +0 -6
- package/lib/pagination/pagination.component.d.ts +0 -24
- package/lib/phone-number/phone-number.pipe.d.ts +0 -7
- package/lib/result-table/result-table.component.d.ts +0 -23
- package/lib/result-table/result-table.model.d.ts +0 -6
- package/lib/sort-key.directive.d.ts +0 -24
- package/lib/sort.directive.d.ts +0 -16
- package/lib/spinner/spinner.component.d.ts +0 -10
- package/lib/subject-display/subject-display.pipe.d.ts +0 -8
- package/lib/svg-icon/svg-icon-config.d.ts +0 -5
- package/lib/svg-icon/svg-icon.component.d.ts +0 -17
- package/lib/testing/muzieh-component-harness.d.ts +0 -2
- package/lib/testing/result-table-harness.d.ts +0 -22
- package/lib/wizard-progress-tracker/wizard-progress-tracker.component.d.ts +0 -13
- package/public-api.d.ts +0 -52
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { InjectionToken, HostBinding, Input, Inject, Component, Pipe, EventEmitter, Output, Optional, ContentChild, Directive, NgModule, LOCALE_ID, input, booleanAttribute, ElementRef, HostListener, ViewEncapsulation, Injectable, ViewChild, ViewContainerRef, ContentChildren } from '@angular/core';
|
|
2
|
+
import { InjectionToken, HostBinding, Input, Inject, Component, Pipe, EventEmitter, Output, Optional, ContentChild, Directive, NgModule, LOCALE_ID, input, booleanAttribute, ElementRef, DOCUMENT, HostListener, ViewEncapsulation, Injectable, ViewChild, ViewContainerRef, ContentChildren } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
|
-
import { CommonModule, DatePipe
|
|
4
|
+
import { CommonModule, DatePipe } from '@angular/common';
|
|
5
5
|
import * as i1$1 from '@angular/router';
|
|
6
6
|
import { NavigationEnd, NavigationCancel, NavigationError, NavigationStart } from '@angular/router';
|
|
7
7
|
import { race, BehaviorSubject, Subscription, fromEvent, merge, filter as filter$1, take as take$1, firstValueFrom } from 'rxjs';
|
|
@@ -50,10 +50,10 @@ class SvgIconComponent {
|
|
|
50
50
|
}
|
|
51
51
|
return `icon icon-${this.size}`;
|
|
52
52
|
}
|
|
53
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
54
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
53
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: SvgIconComponent, deps: [{ token: SVG_ICON_DEFAULT_OPTIONS }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
54
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: SvgIconComponent, isStandalone: true, selector: "mz-svg-icon", inputs: { key: "key", type: "type", size: "size" }, host: { attributes: { "role": "img" }, properties: { "attr.data-icon-name": "key", "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%;display:inline}\n"] }); }
|
|
55
55
|
}
|
|
56
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
56
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: SvgIconComponent, decorators: [{
|
|
57
57
|
type: Component,
|
|
58
58
|
args: [{ selector: 'mz-svg-icon', host: {
|
|
59
59
|
'role': 'img',
|
|
@@ -108,10 +108,10 @@ class EnumDisplayPipe {
|
|
|
108
108
|
firstLetterToUppercase(value) {
|
|
109
109
|
return value.length > 1 ? `${value.substring(0, 1).toUpperCase()}${value.substring(1)}` : value.toUpperCase();
|
|
110
110
|
}
|
|
111
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
112
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
111
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: EnumDisplayPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
112
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: EnumDisplayPipe, isStandalone: true, name: "mzEnumDisplay" }); }
|
|
113
113
|
}
|
|
114
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
114
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: EnumDisplayPipe, decorators: [{
|
|
115
115
|
type: Pipe,
|
|
116
116
|
args: [{
|
|
117
117
|
name: 'mzEnumDisplay',
|
|
@@ -127,10 +127,10 @@ class MzSpinner {
|
|
|
127
127
|
get elementClass() {
|
|
128
128
|
return [`${this.size}`, `${this.appearance}`].join(' ');
|
|
129
129
|
}
|
|
130
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
131
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
130
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzSpinner, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
131
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: MzSpinner, isStandalone: true, selector: "mz-spinner", inputs: { size: "size", appearance: "appearance" }, host: { properties: { "class": "this.elementClass" } }, ngImport: i0, template: "<svg class=\"mz-spinner\" 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;height:100%;width:100%}.opacity-25{opacity:.25}.opacity-75{opacity:.75}:host{display:inline-block}:host.medium{height:1.25rem;width:1.25rem}:host.large{height:4rem;width:4rem}:host.primary{color:var(--color-primary)}:host.secondary{color:var(--color-secondary)}@keyframes spin{to{transform:rotate(360deg)}}\n"] }); }
|
|
132
132
|
}
|
|
133
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
133
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzSpinner, decorators: [{
|
|
134
134
|
type: Component,
|
|
135
135
|
args: [{ selector: 'mz-spinner', imports: [], template: "<svg class=\"mz-spinner\" 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;height:100%;width:100%}.opacity-25{opacity:.25}.opacity-75{opacity:.75}:host{display:inline-block}:host.medium{height:1.25rem;width:1.25rem}:host.large{height:4rem;width:4rem}:host.primary{color:var(--color-primary)}:host.secondary{color:var(--color-secondary)}@keyframes spin{to{transform:rotate(360deg)}}\n"] }]
|
|
136
136
|
}], propDecorators: { size: [{
|
|
@@ -215,10 +215,10 @@ class MzPagination {
|
|
|
215
215
|
}
|
|
216
216
|
this.pages = pageNumbers;
|
|
217
217
|
}
|
|
218
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
219
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
218
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzPagination, deps: [{ token: MZ_PAGINATION_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
219
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: MzPagination, isStandalone: true, selector: "mz-pagination", inputs: { totalItems: "totalItems", pageNumber: "pageNumber", scrollTo: "scrollTo", pageSizeOptions: "pageSizeOptions", pageSize: "pageSize" }, 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 page-icon-link\" [class.disabled]=\"pageNumber === 1\" (click)=\"changePageNumber(pageNumber - 1)\" aria-label=\"Previous page\">\n <mz-svg-icon key=\"chevron-left-solid\"></mz-svg-icon>\n </button>\n @for(p of pages; track $index) {\n @if(isEllipsis(p)) {\n <span class=\"page-ellipsis page-link disabled\">...</span>\n } @else {\n <button class=\"page-link\" [class.active]=\"p === pageNumber\" (click)=\"changePageNumber(p)\">{{ p }}</button>\n }\n }\n\n <button class=\"page-link page-icon-link\" [class.disabled]=\"pageNumber === pageCount\" (click)=\"changePageNumber(pageNumber + 1)\" aria-label=\"Next page\">\n <mz-svg-icon key=\"chevron-right-solid\"></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 @for(size of pageSizeOptions; track size) {\n <option [attr.selected]=\"pageSize == size ? true : null\" [value]=\"size\">{{ size }}</option>\n }\n </select>\n per page\n </div>\n</div>\n", styles: [":root{--color-primary: #1d4ed8;--color-secondary: #374151;--color-success: #15803d;--color-danger: #b91c1c;--color-warning: #a16207;--color-neutral-50: #f9fafb;--color-neutral-100: #f3f4f6;--color-neutral-200: #e5e7eb;--color-neutral-300: #d1d5db;--color-neutral-400: #9ca3af;--color-neutral-500: #6b7280;--color-neutral-600: #4b5563;--color-neutral-700: #374151;--color-neutral-800: #1f2937;--color-neutral-900: #111827;--color-neutral-950: #030712;--color-brand-50: #eff6ff;--color-brand-100: #dbeafe;--color-brand-200: #bfdbfe;--color-brand-300: #93c5fd;--color-brand-400: #60a5fa;--color-brand-500: #3b82f6;--color-brand-600: #2563eb;--color-brand-700: #1d4ed8;--color-brand-800: #1e40af;--color-brand-900: #1e3a8a;--color-brand-950: #172554;--color-green-50: #f0fdf4;--color-green-100: #dcfce7;--color-green-200: #bbf7d0;--color-green-300: #86efac;--color-green-400: #4ade80;--color-green-500: #22c55e;--color-green-600: #16a34a;--color-green-700: #15803d;--color-green-800: #166534;--color-green-900: #14532d;--color-green-950: #052e16;--color-red-50: #fef2f2;--color-red-100: #fee2e2;--color-red-200: #fecaca;--color-red-300: #fca5a5;--color-red-400: #f87171;--color-red-500: #ef4444;--color-red-600: #dc2626;--color-red-700: #b91c1c;--color-red-800: #991b1b;--color-red-900: #7f1d1d;--color-red-950: #450a0a;--color-yellow-50: #fefce8;--color-yellow-100: #fef9c3;--color-yellow-200: #fef08a;--color-yellow-300: #fde047;--color-yellow-400: #facc15;--color-yellow-500: #eab308;--color-yellow-600: #ca8a04;--color-yellow-700: #a16207;--color-yellow-800: #854d0e;--color-yellow-900: #713f12;--color-yellow-950: #422006;--border-radius: 0px;--surface-bg: #fff;--surface-border-radius: 0rem;--button-border-radius: 0rem}.pagination-wrapper{display:flex;justify-content:center;color:var(--text-subtlest);gap:1.25rem}.pagination-nav{display:flex;justify-content:center;flex-grow:1;padding-left:1rem;padding-right:1rem}.page-link{display:flex;cursor:pointer;padding:1rem;font-weight:500;color:var(--color-neutral-600)}.page-link:hover{color:var(--color-primary)}.page-link.active{color:var(--color-primary);font-weight:bolder;cursor:default}.page-link.disabled{color:var(--color-neutral-400);cursor:default;text-decoration:none}.pagination-size{color:var(--color-neutral-500);padding:1rem;font-size:.875rem;line-height:1.4285714286;margin-left:auto;display:none;flex-grow:0}@media (min-width: 1024px){.pagination-size{display:inline-block}}.page-size-control{padding:0rem 1.75rem 0rem .125rem;margin-left:.25rem;margin-right:.25rem}\n"], dependencies: [{ kind: "component", type: SvgIconComponent, selector: "mz-svg-icon", inputs: ["key", "type", "size"] }] }); }
|
|
220
220
|
}
|
|
221
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
221
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzPagination, decorators: [{
|
|
222
222
|
type: Component,
|
|
223
223
|
args: [{ selector: 'mz-pagination', imports: [SvgIconComponent], template: "<div class=\"pagination-wrapper\">\n <nav class=\"pagination-nav\" aria-label=\"pagination\">\n <button class=\"page-link page-icon-link\" [class.disabled]=\"pageNumber === 1\" (click)=\"changePageNumber(pageNumber - 1)\" aria-label=\"Previous page\">\n <mz-svg-icon key=\"chevron-left-solid\"></mz-svg-icon>\n </button>\n @for(p of pages; track $index) {\n @if(isEllipsis(p)) {\n <span class=\"page-ellipsis page-link disabled\">...</span>\n } @else {\n <button class=\"page-link\" [class.active]=\"p === pageNumber\" (click)=\"changePageNumber(p)\">{{ p }}</button>\n }\n }\n\n <button class=\"page-link page-icon-link\" [class.disabled]=\"pageNumber === pageCount\" (click)=\"changePageNumber(pageNumber + 1)\" aria-label=\"Next page\">\n <mz-svg-icon key=\"chevron-right-solid\"></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 @for(size of pageSizeOptions; track size) {\n <option [attr.selected]=\"pageSize == size ? true : null\" [value]=\"size\">{{ size }}</option>\n }\n </select>\n per page\n </div>\n</div>\n", styles: [":root{--color-primary: #1d4ed8;--color-secondary: #374151;--color-success: #15803d;--color-danger: #b91c1c;--color-warning: #a16207;--color-neutral-50: #f9fafb;--color-neutral-100: #f3f4f6;--color-neutral-200: #e5e7eb;--color-neutral-300: #d1d5db;--color-neutral-400: #9ca3af;--color-neutral-500: #6b7280;--color-neutral-600: #4b5563;--color-neutral-700: #374151;--color-neutral-800: #1f2937;--color-neutral-900: #111827;--color-neutral-950: #030712;--color-brand-50: #eff6ff;--color-brand-100: #dbeafe;--color-brand-200: #bfdbfe;--color-brand-300: #93c5fd;--color-brand-400: #60a5fa;--color-brand-500: #3b82f6;--color-brand-600: #2563eb;--color-brand-700: #1d4ed8;--color-brand-800: #1e40af;--color-brand-900: #1e3a8a;--color-brand-950: #172554;--color-green-50: #f0fdf4;--color-green-100: #dcfce7;--color-green-200: #bbf7d0;--color-green-300: #86efac;--color-green-400: #4ade80;--color-green-500: #22c55e;--color-green-600: #16a34a;--color-green-700: #15803d;--color-green-800: #166534;--color-green-900: #14532d;--color-green-950: #052e16;--color-red-50: #fef2f2;--color-red-100: #fee2e2;--color-red-200: #fecaca;--color-red-300: #fca5a5;--color-red-400: #f87171;--color-red-500: #ef4444;--color-red-600: #dc2626;--color-red-700: #b91c1c;--color-red-800: #991b1b;--color-red-900: #7f1d1d;--color-red-950: #450a0a;--color-yellow-50: #fefce8;--color-yellow-100: #fef9c3;--color-yellow-200: #fef08a;--color-yellow-300: #fde047;--color-yellow-400: #facc15;--color-yellow-500: #eab308;--color-yellow-600: #ca8a04;--color-yellow-700: #a16207;--color-yellow-800: #854d0e;--color-yellow-900: #713f12;--color-yellow-950: #422006;--border-radius: 0px;--surface-bg: #fff;--surface-border-radius: 0rem;--button-border-radius: 0rem}.pagination-wrapper{display:flex;justify-content:center;color:var(--text-subtlest);gap:1.25rem}.pagination-nav{display:flex;justify-content:center;flex-grow:1;padding-left:1rem;padding-right:1rem}.page-link{display:flex;cursor:pointer;padding:1rem;font-weight:500;color:var(--color-neutral-600)}.page-link:hover{color:var(--color-primary)}.page-link.active{color:var(--color-primary);font-weight:bolder;cursor:default}.page-link.disabled{color:var(--color-neutral-400);cursor:default;text-decoration:none}.pagination-size{color:var(--color-neutral-500);padding:1rem;font-size:.875rem;line-height:1.4285714286;margin-left:auto;display:none;flex-grow:0}@media (min-width: 1024px){.pagination-size{display:inline-block}}.page-size-control{padding:0rem 1.75rem 0rem .125rem;margin-left:.25rem;margin-right:.25rem}\n"] }]
|
|
224
224
|
}], ctorParameters: () => [{ type: MzPaginationConfig, decorators: [{
|
|
@@ -269,12 +269,12 @@ class ResultTableComponent {
|
|
|
269
269
|
get isEmpty() {
|
|
270
270
|
return !this.model || this.model.items.length === 0;
|
|
271
271
|
}
|
|
272
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
273
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
272
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ResultTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
273
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", 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 @if (state === 'loading') {\n <div class=\"loading-overlay-spinner\">\n <mz-spinner size=\"large\"></mz-spinner>\n </div>\n }\n <table class=\"table\" [ngClass]=\"{'has-overlay' : state === 'loading'}\">\n @if (state === 'succeeded' && model && model.items.length > 0) {\n <caption>\n {{(model.pageNumber-1) * model.pageSize + 1}} - {{(model.pageNumber-1) * model.pageSize + model.items.length}} of {{ model.totalItems }} results\n </caption>\n }\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 @if (state === 'succeeded' && !options?.hidePagination && !isEmpty) {\n <div class=\"table-pagination\">\n <mz-pagination [totalItems]=\"model!.totalItems\" [pageNumber]=\"model!.pageNumber\" [pageSize]=\"model!.pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n [scrollTo]=\"tableRef\"\n (changePage)=\"changePage($event)\"></mz-pagination>\n </div>\n }\n @if (state == 'succeeded' && isEmpty) {\n <div class=\"state-message\">\n <div class=\"title\">No results found</div>\n </div>\n }\n @if (state == 'failed') {\n <div class=\"state-message\">\n <div class=\"title\">\n <mz-svg-icon key=\"x-circle-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 }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MzPagination, selector: "mz-pagination", inputs: ["totalItems", "pageNumber", "scrollTo", "pageSizeOptions", "pageSize"], outputs: ["changePage"] }, { kind: "component", type: MzSpinner, selector: "mz-spinner", inputs: ["size", "appearance"] }, { kind: "component", type: SvgIconComponent, selector: "mz-svg-icon", inputs: ["key", "type", "size"] }] }); }
|
|
274
274
|
}
|
|
275
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
275
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ResultTableComponent, decorators: [{
|
|
276
276
|
type: Component,
|
|
277
|
-
args: [{ selector: 'mz-result-table', imports: [CommonModule, MzPagination, MzSpinner, SvgIconComponent], template: "<div class=\"result-table\" [ngClass]=\"{'loading': state === 'loading', 'failed': state === 'failed'}\" #tableRef>\n <div class=\"loading-overlay-spinner\"
|
|
277
|
+
args: [{ selector: 'mz-result-table', imports: [CommonModule, MzPagination, MzSpinner, SvgIconComponent], template: "<div class=\"result-table\" [ngClass]=\"{'loading': state === 'loading', 'failed': state === 'failed'}\" #tableRef>\n @if (state === 'loading') {\n <div class=\"loading-overlay-spinner\">\n <mz-spinner size=\"large\"></mz-spinner>\n </div>\n }\n <table class=\"table\" [ngClass]=\"{'has-overlay' : state === 'loading'}\">\n @if (state === 'succeeded' && model && model.items.length > 0) {\n <caption>\n {{(model.pageNumber-1) * model.pageSize + 1}} - {{(model.pageNumber-1) * model.pageSize + model.items.length}} of {{ model.totalItems }} results\n </caption>\n }\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 @if (state === 'succeeded' && !options?.hidePagination && !isEmpty) {\n <div class=\"table-pagination\">\n <mz-pagination [totalItems]=\"model!.totalItems\" [pageNumber]=\"model!.pageNumber\" [pageSize]=\"model!.pageSize\"\n [pageSizeOptions]=\"pageSizeOptions\"\n [scrollTo]=\"tableRef\"\n (changePage)=\"changePage($event)\"></mz-pagination>\n </div>\n }\n @if (state == 'succeeded' && isEmpty) {\n <div class=\"state-message\">\n <div class=\"title\">No results found</div>\n </div>\n }\n @if (state == 'failed') {\n <div class=\"state-message\">\n <div class=\"title\">\n <mz-svg-icon key=\"x-circle-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 }\n</div>\n" }]
|
|
278
278
|
}], ctorParameters: () => [], propDecorators: { loading: [{
|
|
279
279
|
type: Input
|
|
280
280
|
}], error: [{
|
|
@@ -309,10 +309,10 @@ class PageLoadingIndicatorComponent {
|
|
|
309
309
|
// the flag need to be reset to false when the page finishes loading
|
|
310
310
|
endObs$.subscribe(() => (this.isLoading = false));
|
|
311
311
|
}
|
|
312
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
313
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
312
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PageLoadingIndicatorComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
313
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: PageLoadingIndicatorComponent, isStandalone: true, selector: "mz-page-loading-indicator", inputs: { isLoading: "isLoading" }, ngImport: i0, template: "<div class=\"progress-bar-container\" [class.loading]=\"isLoading\">\n <div class=\"progress-bar\"></div>\n <div class=\"progress-bar-value\"></div>\n</div>\n", styles: [":root{--color-primary: #1d4ed8;--color-secondary: #374151;--color-success: #15803d;--color-danger: #b91c1c;--color-warning: #a16207;--color-neutral-50: #f9fafb;--color-neutral-100: #f3f4f6;--color-neutral-200: #e5e7eb;--color-neutral-300: #d1d5db;--color-neutral-400: #9ca3af;--color-neutral-500: #6b7280;--color-neutral-600: #4b5563;--color-neutral-700: #374151;--color-neutral-800: #1f2937;--color-neutral-900: #111827;--color-neutral-950: #030712;--color-brand-50: #eff6ff;--color-brand-100: #dbeafe;--color-brand-200: #bfdbfe;--color-brand-300: #93c5fd;--color-brand-400: #60a5fa;--color-brand-500: #3b82f6;--color-brand-600: #2563eb;--color-brand-700: #1d4ed8;--color-brand-800: #1e40af;--color-brand-900: #1e3a8a;--color-brand-950: #172554;--color-green-50: #f0fdf4;--color-green-100: #dcfce7;--color-green-200: #bbf7d0;--color-green-300: #86efac;--color-green-400: #4ade80;--color-green-500: #22c55e;--color-green-600: #16a34a;--color-green-700: #15803d;--color-green-800: #166534;--color-green-900: #14532d;--color-green-950: #052e16;--color-red-50: #fef2f2;--color-red-100: #fee2e2;--color-red-200: #fecaca;--color-red-300: #fca5a5;--color-red-400: #f87171;--color-red-500: #ef4444;--color-red-600: #dc2626;--color-red-700: #b91c1c;--color-red-800: #991b1b;--color-red-900: #7f1d1d;--color-red-950: #450a0a;--color-yellow-50: #fefce8;--color-yellow-100: #fef9c3;--color-yellow-200: #fef08a;--color-yellow-300: #fde047;--color-yellow-400: #facc15;--color-yellow-500: #eab308;--color-yellow-600: #ca8a04;--color-yellow-700: #a16207;--color-yellow-800: #854d0e;--color-yellow-900: #713f12;--color-yellow-950: #422006;--border-radius: 0px;--surface-bg: #fff;--surface-border-radius: 0rem;--button-border-radius: 0rem}.progress-bar-container{position:relative}.progress-bar-container.loading{height:.25rem}.progress-bar{width:100%;height:100%;background:var(--color-primary);opacity:.5;position:absolute}.progress-bar-value{width:100%;height:100%;background:var(--color-primary);transform-origin:0% 50%;animation:indeterminateAnimation .75s infinite linear}@keyframes indeterminateAnimation{0%{transform:translate(0) scaleX(0)}40%{transform:translate(0) scaleX(.4)}to{transform:translate(100%) scaleX(.5)}}\n"] }); }
|
|
314
314
|
}
|
|
315
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
315
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PageLoadingIndicatorComponent, decorators: [{
|
|
316
316
|
type: Component,
|
|
317
317
|
args: [{ selector: 'mz-page-loading-indicator', imports: [], template: "<div class=\"progress-bar-container\" [class.loading]=\"isLoading\">\n <div class=\"progress-bar\"></div>\n <div class=\"progress-bar-value\"></div>\n</div>\n", styles: [":root{--color-primary: #1d4ed8;--color-secondary: #374151;--color-success: #15803d;--color-danger: #b91c1c;--color-warning: #a16207;--color-neutral-50: #f9fafb;--color-neutral-100: #f3f4f6;--color-neutral-200: #e5e7eb;--color-neutral-300: #d1d5db;--color-neutral-400: #9ca3af;--color-neutral-500: #6b7280;--color-neutral-600: #4b5563;--color-neutral-700: #374151;--color-neutral-800: #1f2937;--color-neutral-900: #111827;--color-neutral-950: #030712;--color-brand-50: #eff6ff;--color-brand-100: #dbeafe;--color-brand-200: #bfdbfe;--color-brand-300: #93c5fd;--color-brand-400: #60a5fa;--color-brand-500: #3b82f6;--color-brand-600: #2563eb;--color-brand-700: #1d4ed8;--color-brand-800: #1e40af;--color-brand-900: #1e3a8a;--color-brand-950: #172554;--color-green-50: #f0fdf4;--color-green-100: #dcfce7;--color-green-200: #bbf7d0;--color-green-300: #86efac;--color-green-400: #4ade80;--color-green-500: #22c55e;--color-green-600: #16a34a;--color-green-700: #15803d;--color-green-800: #166534;--color-green-900: #14532d;--color-green-950: #052e16;--color-red-50: #fef2f2;--color-red-100: #fee2e2;--color-red-200: #fecaca;--color-red-300: #fca5a5;--color-red-400: #f87171;--color-red-500: #ef4444;--color-red-600: #dc2626;--color-red-700: #b91c1c;--color-red-800: #991b1b;--color-red-900: #7f1d1d;--color-red-950: #450a0a;--color-yellow-50: #fefce8;--color-yellow-100: #fef9c3;--color-yellow-200: #fef08a;--color-yellow-300: #fde047;--color-yellow-400: #facc15;--color-yellow-500: #eab308;--color-yellow-600: #ca8a04;--color-yellow-700: #a16207;--color-yellow-800: #854d0e;--color-yellow-900: #713f12;--color-yellow-950: #422006;--border-radius: 0px;--surface-bg: #fff;--surface-border-radius: 0rem;--button-border-radius: 0rem}.progress-bar-container{position:relative}.progress-bar-container.loading{height:.25rem}.progress-bar{width:100%;height:100%;background:var(--color-primary);opacity:.5;position:absolute}.progress-bar-value{width:100%;height:100%;background:var(--color-primary);transform-origin:0% 50%;animation:indeterminateAnimation .75s infinite linear}@keyframes indeterminateAnimation{0%{transform:translate(0) scaleX(0)}40%{transform:translate(0) scaleX(.4)}to{transform:translate(100%) scaleX(.5)}}\n"] }]
|
|
318
318
|
}], ctorParameters: () => [{ type: i1$1.Router }], propDecorators: { isLoading: [{
|
|
@@ -332,10 +332,10 @@ class PageHeaderComponent {
|
|
|
332
332
|
this.title.setTitle(newValue);
|
|
333
333
|
}
|
|
334
334
|
ngOnInit() { }
|
|
335
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
336
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
335
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PageHeaderComponent, deps: [{ token: i1$2.Title }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
336
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", 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: [""] }); }
|
|
337
337
|
}
|
|
338
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
338
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PageHeaderComponent, decorators: [{
|
|
339
339
|
type: Component,
|
|
340
340
|
args: [{ selector: 'mz-page-header', standalone: true, template: "<header class=\"page-header\">\n <h1>{{ pageTitle }}</h1>\n <ng-content></ng-content>\n</header>" }]
|
|
341
341
|
}], ctorParameters: () => [{ type: i1$2.Title }], propDecorators: { pageTitle: [{
|
|
@@ -367,12 +367,12 @@ class AlertComponent {
|
|
|
367
367
|
}
|
|
368
368
|
return icon;
|
|
369
369
|
}
|
|
370
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
371
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
370
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: AlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
371
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", 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()\"></mz-svg-icon>\n </div>\n\n <div class=\"alert-title\">\n <strong>{{ title }}</strong>\n </div>\n </div>\n\n @if (body) {\n <div class=\"alert-body\">\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\n </div>\n }\n\n @if (footer) {\n <div class=\"alert-footer\">\n <ng-container *ngTemplateOutlet=\"footer\"></ng-container>\n </div>\n }\n\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SvgIconComponent, selector: "mz-svg-icon", inputs: ["key", "type", "size"] }] }); }
|
|
372
372
|
}
|
|
373
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
373
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: AlertComponent, decorators: [{
|
|
374
374
|
type: Component,
|
|
375
|
-
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()\"></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\"
|
|
375
|
+
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()\"></mz-svg-icon>\n </div>\n\n <div class=\"alert-title\">\n <strong>{{ title }}</strong>\n </div>\n </div>\n\n @if (body) {\n <div class=\"alert-body\">\n <ng-container *ngTemplateOutlet=\"body\"></ng-container>\n </div>\n }\n\n @if (footer) {\n <div class=\"alert-footer\">\n <ng-container *ngTemplateOutlet=\"footer\"></ng-container>\n </div>\n }\n\n</div>" }]
|
|
376
376
|
}], ctorParameters: () => [], propDecorators: { title: [{
|
|
377
377
|
type: Input
|
|
378
378
|
}], type: [{
|
|
@@ -394,10 +394,10 @@ class PhoneNumberPipe {
|
|
|
394
394
|
}
|
|
395
395
|
return number;
|
|
396
396
|
}
|
|
397
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
398
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
397
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PhoneNumberPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
398
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: PhoneNumberPipe, isStandalone: true, name: "mzPhoneNumber" }); }
|
|
399
399
|
}
|
|
400
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
400
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: PhoneNumberPipe, decorators: [{
|
|
401
401
|
type: Pipe,
|
|
402
402
|
args: [{
|
|
403
403
|
name: 'mzPhoneNumber',
|
|
@@ -425,10 +425,10 @@ class DateDisplayPipe {
|
|
|
425
425
|
}
|
|
426
426
|
return redefinedDate;
|
|
427
427
|
}
|
|
428
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
429
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
428
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: DateDisplayPipe, deps: [{ token: i1.DatePipe }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
429
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: DateDisplayPipe, isStandalone: true, name: "mzDateDisplay" }); }
|
|
430
430
|
}
|
|
431
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
431
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: DateDisplayPipe, decorators: [{
|
|
432
432
|
type: Pipe,
|
|
433
433
|
args: [{
|
|
434
434
|
name: 'mzDateDisplay',
|
|
@@ -451,10 +451,10 @@ class SortDirective {
|
|
|
451
451
|
setActiveHeaderSort() {
|
|
452
452
|
this.active = this._mzSort.includes('-') ? this._mzSort.slice(1) : this._mzSort;
|
|
453
453
|
}
|
|
454
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
455
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
454
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: SortDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
455
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.4", type: SortDirective, isStandalone: true, selector: "[mzSort]", inputs: { mzSort: "mzSort" }, outputs: { sort: "sort" }, usesOnChanges: true, ngImport: i0 }); }
|
|
456
456
|
}
|
|
457
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
457
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: SortDirective, decorators: [{
|
|
458
458
|
type: Directive,
|
|
459
459
|
args: [{
|
|
460
460
|
selector: '[mzSort]',
|
|
@@ -536,10 +536,10 @@ class SortKeyDirective {
|
|
|
536
536
|
setOrder(sort) {
|
|
537
537
|
this.order = sort.includes('-') ? 'desc' : 'asc';
|
|
538
538
|
}
|
|
539
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
540
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
539
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: SortKeyDirective, deps: [{ token: SortDirective }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
540
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.4", type: SortKeyDirective, isStandalone: true, selector: "[mzSortKey]", inputs: { mzSortKey: "mzSortKey" }, host: { attributes: { "role": "button" }, listeners: { "click": "onClick()" }, properties: { "attr.aria-sort": "getAriaSortAttribute()" } }, ngImport: i0 }); }
|
|
541
541
|
}
|
|
542
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
542
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: SortKeyDirective, decorators: [{
|
|
543
543
|
type: Directive,
|
|
544
544
|
args: [{
|
|
545
545
|
selector: '[mzSortKey]',
|
|
@@ -561,10 +561,10 @@ class SubjectDisplayPipe {
|
|
|
561
561
|
}
|
|
562
562
|
return subject.givenName && subject.familyName ? `${subject.givenName} ${subject.familyName}` : subject.userPrincipalName;
|
|
563
563
|
}
|
|
564
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
565
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
564
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: SubjectDisplayPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
565
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: SubjectDisplayPipe, isStandalone: true, name: "mzSubjectDisplay" }); }
|
|
566
566
|
}
|
|
567
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
567
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: SubjectDisplayPipe, decorators: [{
|
|
568
568
|
type: Pipe,
|
|
569
569
|
args: [{
|
|
570
570
|
name: 'mzSubjectDisplay',
|
|
@@ -634,10 +634,10 @@ class ButtonDirective {
|
|
|
634
634
|
getOverlayDiv() {
|
|
635
635
|
return this.getChildElement('.button-loading-overlay');
|
|
636
636
|
}
|
|
637
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
638
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
637
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ButtonDirective, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
638
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.4", type: ButtonDirective, isStandalone: true, selector: "[mzButton]", inputs: { variant: "variant", busy: "busy" }, host: { attributes: { "role": "button" }, properties: { "attr.tabindex": "0", "attr.aria-busy": "busy", "class": "this.elementClass" } }, usesOnChanges: true, ngImport: i0 }); }
|
|
639
639
|
}
|
|
640
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
640
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: ButtonDirective, decorators: [{
|
|
641
641
|
type: Directive,
|
|
642
642
|
args: [{
|
|
643
643
|
selector: '[mzButton]',
|
|
@@ -670,12 +670,12 @@ class WizardProgressTrackerComponent {
|
|
|
670
670
|
toggle() {
|
|
671
671
|
this.toggled = !this.toggled;
|
|
672
672
|
}
|
|
673
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
674
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
673
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: WizardProgressTrackerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
674
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", 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 @for (step of steps; track step; let i = $index) {\n <div 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 @if (i > 0) {\n <div class=\"step-line left\"></div>\n }\n @if (i < currentStep) {\n <div class=\"wizard-step-icon\">\n <mz-svg-icon key=\"check-circle-solid\">\n </mz-svg-icon>\n </div>\n }\n @if (i === currentStep) {\n <div class=\"wizard-step-icon\">\n <div class=\"step-inner-circle\"></div>\n </div>\n }\n @if (i > currentStep) {\n <div class=\"wizard-step-icon\">\n </div>\n }\n @if (i < (steps.length - 1)) {\n <div class=\"step-line step-line-right\"></div>\n }\n <div class=\"spacer right\"></div>\n </div>\n @if (i < currentStep) {\n <a class=\"step-desc\" (click)=\"goToStep(step)\"> {{\n step.name\n }}</a>\n }\n @if ( i === currentStep) {\n <div class=\"step-desc\"> {{ step.name }}\n </div>\n }\n @if ( i > currentStep) {\n <div class=\"step-desc\"> {{ step.name }}\n </div>\n }\n <div class=\"toggable-icon\">\n @if (!toggled) {\n <button (click)=\"toggle()\">\n <mz-svg-icon key=\"chevron-down-solid\"></mz-svg-icon>\n </button>\n }\n @if (toggled) {\n <button (click)=\"toggle()\">\n <mz-svg-icon key=\"chevron-up-solid\"></mz-svg-icon>\n </button>\n }\n </div>\n </ng-container>\n </div>\n }\n </div>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: SvgIconComponent, selector: "mz-svg-icon", inputs: ["key", "type", "size"] }] }); }
|
|
675
675
|
}
|
|
676
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
676
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: WizardProgressTrackerComponent, decorators: [{
|
|
677
677
|
type: Component,
|
|
678
|
-
args: [{ selector: 'mz-wizard-progress-tracker', imports: [CommonModule, SvgIconComponent], template: "<div class=\"wizard-progress-tracker\">\n
|
|
678
|
+
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 @for (step of steps; track step; let i = $index) {\n <div 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 @if (i > 0) {\n <div class=\"step-line left\"></div>\n }\n @if (i < currentStep) {\n <div class=\"wizard-step-icon\">\n <mz-svg-icon key=\"check-circle-solid\">\n </mz-svg-icon>\n </div>\n }\n @if (i === currentStep) {\n <div class=\"wizard-step-icon\">\n <div class=\"step-inner-circle\"></div>\n </div>\n }\n @if (i > currentStep) {\n <div class=\"wizard-step-icon\">\n </div>\n }\n @if (i < (steps.length - 1)) {\n <div class=\"step-line step-line-right\"></div>\n }\n <div class=\"spacer right\"></div>\n </div>\n @if (i < currentStep) {\n <a class=\"step-desc\" (click)=\"goToStep(step)\"> {{\n step.name\n }}</a>\n }\n @if ( i === currentStep) {\n <div class=\"step-desc\"> {{ step.name }}\n </div>\n }\n @if ( i > currentStep) {\n <div class=\"step-desc\"> {{ step.name }}\n </div>\n }\n <div class=\"toggable-icon\">\n @if (!toggled) {\n <button (click)=\"toggle()\">\n <mz-svg-icon key=\"chevron-down-solid\"></mz-svg-icon>\n </button>\n }\n @if (toggled) {\n <button (click)=\"toggle()\">\n <mz-svg-icon key=\"chevron-up-solid\"></mz-svg-icon>\n </button>\n }\n </div>\n </ng-container>\n </div>\n }\n </div>\n </div>\n</div>\n" }]
|
|
679
679
|
}], propDecorators: { steps: [{
|
|
680
680
|
type: Input
|
|
681
681
|
}], currentStep: [{
|
|
@@ -703,12 +703,12 @@ class InfiniteScrollComponent {
|
|
|
703
703
|
this.selectedItem = item;
|
|
704
704
|
this.itemSelected.emit(item);
|
|
705
705
|
}
|
|
706
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
707
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
706
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: InfiniteScrollComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
707
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", 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 @if (itemTemplate) {\n @for (item of items; track $index) {\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n }\n } @else {\n @for (item of items; track $index) {\n <div class=\"scroll-item\" [ngClass]=\"{'scroll-item-selected': selectedItem === item}\" (click)=\"onItemClick(item)\">\n {{ item.label }}\n </div>\n }\n }\n\n <!-- Spinner -->\n @if (isLoading) {\n <div class=\"scroll-spinner-container\">\n <mz-spinner size=\"medium\" type=\"secondary\"></mz-spinner>\n </div>\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MzSpinner, selector: "mz-spinner", inputs: ["size", "appearance"] }] }); }
|
|
708
708
|
}
|
|
709
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
709
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: InfiniteScrollComponent, decorators: [{
|
|
710
710
|
type: Component,
|
|
711
|
-
args: [{ selector: 'mz-infinite-scroll', imports: [CommonModule, MzSpinner], template: "<div class=\"infinite-scroll-container overflow-auto\" [style.height]=\"containerHeight\" (scroll)=\"onContainerScroll($event)\">\n
|
|
711
|
+
args: [{ selector: 'mz-infinite-scroll', imports: [CommonModule, MzSpinner], template: "<div class=\"infinite-scroll-container overflow-auto\" [style.height]=\"containerHeight\" (scroll)=\"onContainerScroll($event)\">\n @if (itemTemplate) {\n @for (item of items; track $index) {\n <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n }\n } @else {\n @for (item of items; track $index) {\n <div class=\"scroll-item\" [ngClass]=\"{'scroll-item-selected': selectedItem === item}\" (click)=\"onItemClick(item)\">\n {{ item.label }}\n </div>\n }\n }\n\n <!-- Spinner -->\n @if (isLoading) {\n <div class=\"scroll-spinner-container\">\n <mz-spinner size=\"medium\" type=\"secondary\"></mz-spinner>\n </div>\n }\n</div>\n" }]
|
|
712
712
|
}], propDecorators: { items: [{
|
|
713
713
|
type: Input
|
|
714
714
|
}], isLoading: [{
|
|
@@ -728,8 +728,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
|
|
|
728
728
|
* @deprecated Import components and component modules separately.
|
|
729
729
|
*/
|
|
730
730
|
class MuziehComponentsModule {
|
|
731
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
732
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
731
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MuziehComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
732
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: MuziehComponentsModule, imports: [CommonModule,
|
|
733
733
|
FormsModule,
|
|
734
734
|
ButtonDirective,
|
|
735
735
|
SvgIconComponent,
|
|
@@ -762,7 +762,7 @@ class MuziehComponentsModule {
|
|
|
762
762
|
SubjectDisplayPipe,
|
|
763
763
|
ButtonDirective,
|
|
764
764
|
WizardProgressTrackerComponent] }); }
|
|
765
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
765
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MuziehComponentsModule, providers: [
|
|
766
766
|
DatePipe,
|
|
767
767
|
], imports: [CommonModule,
|
|
768
768
|
FormsModule,
|
|
@@ -771,7 +771,7 @@ class MuziehComponentsModule {
|
|
|
771
771
|
ResultTableComponent,
|
|
772
772
|
InfiniteScrollComponent] }); }
|
|
773
773
|
}
|
|
774
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
774
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MuziehComponentsModule, decorators: [{
|
|
775
775
|
type: NgModule,
|
|
776
776
|
args: [{
|
|
777
777
|
imports: [
|
|
@@ -847,10 +847,10 @@ class MzDatePipe extends DatePipe {
|
|
|
847
847
|
}
|
|
848
848
|
return super.transform(value, translatedFormat, translatedTimezone, locale);
|
|
849
849
|
}
|
|
850
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
851
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
850
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDatePipe, deps: [{ token: LOCALE_ID }, { token: MZ_DATE_PIPE_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
851
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: MzDatePipe, isStandalone: true, name: "mzDate" }); }
|
|
852
852
|
}
|
|
853
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
853
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDatePipe, decorators: [{
|
|
854
854
|
type: Pipe,
|
|
855
855
|
args: [{
|
|
856
856
|
name: 'mzDate',
|
|
@@ -871,9 +871,9 @@ class MzButton {
|
|
|
871
871
|
return ['button', `button-${this.appearance()}`, this.busy() ? 'busy' : ''].join(' ');
|
|
872
872
|
}
|
|
873
873
|
constructor(elementRef) {
|
|
874
|
-
this.appearance = input('secondary');
|
|
875
|
-
this.busy = input(false);
|
|
876
|
-
this.disabled = input(false, { transform: booleanAttribute });
|
|
874
|
+
this.appearance = input('secondary', ...(ngDevMode ? [{ debugName: "appearance" }] : []));
|
|
875
|
+
this.busy = input(false, ...(ngDevMode ? [{ debugName: "busy" }] : []));
|
|
876
|
+
this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
|
|
877
877
|
elementRef.nativeElement.addEventListener('click', (event) => {
|
|
878
878
|
if (this.busy() || this.disabled()) {
|
|
879
879
|
event.preventDefault();
|
|
@@ -883,10 +883,10 @@ class MzButton {
|
|
|
883
883
|
}
|
|
884
884
|
});
|
|
885
885
|
}
|
|
886
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
887
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
886
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzButton, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
887
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: MzButton, isStandalone: true, selector: "button[mz-button], a[mz-button], button[mzButton], a[mzButton]", inputs: { appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, busy: { classPropertyName: "busy", publicName: "busy", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.elementClass" } }, ngImport: i0, template: "@if(busy()) {\n<span class=\"button--loading\">\n <svg class=\"button--loading-spinner\" xmlns=\"http://www.w3.org/2000/svg\" 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\" 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\"></path>\n </svg>\n</span>\n}\n<span class=\"button--label\">\n <ng-content></ng-content>\n</span>\n", styles: [":root{--color-primary: #1d4ed8;--color-secondary: #374151;--color-success: #15803d;--color-danger: #b91c1c;--color-warning: #a16207;--color-neutral-50: #f9fafb;--color-neutral-100: #f3f4f6;--color-neutral-200: #e5e7eb;--color-neutral-300: #d1d5db;--color-neutral-400: #9ca3af;--color-neutral-500: #6b7280;--color-neutral-600: #4b5563;--color-neutral-700: #374151;--color-neutral-800: #1f2937;--color-neutral-900: #111827;--color-neutral-950: #030712;--color-brand-50: #eff6ff;--color-brand-100: #dbeafe;--color-brand-200: #bfdbfe;--color-brand-300: #93c5fd;--color-brand-400: #60a5fa;--color-brand-500: #3b82f6;--color-brand-600: #2563eb;--color-brand-700: #1d4ed8;--color-brand-800: #1e40af;--color-brand-900: #1e3a8a;--color-brand-950: #172554;--color-green-50: #f0fdf4;--color-green-100: #dcfce7;--color-green-200: #bbf7d0;--color-green-300: #86efac;--color-green-400: #4ade80;--color-green-500: #22c55e;--color-green-600: #16a34a;--color-green-700: #15803d;--color-green-800: #166534;--color-green-900: #14532d;--color-green-950: #052e16;--color-red-50: #fef2f2;--color-red-100: #fee2e2;--color-red-200: #fecaca;--color-red-300: #fca5a5;--color-red-400: #f87171;--color-red-500: #ef4444;--color-red-600: #dc2626;--color-red-700: #b91c1c;--color-red-800: #991b1b;--color-red-900: #7f1d1d;--color-red-950: #450a0a;--color-yellow-50: #fefce8;--color-yellow-100: #fef9c3;--color-yellow-200: #fef08a;--color-yellow-300: #fde047;--color-yellow-400: #facc15;--color-yellow-500: #eab308;--color-yellow-600: #ca8a04;--color-yellow-700: #a16207;--color-yellow-800: #854d0e;--color-yellow-900: #713f12;--color-yellow-950: #422006;--border-radius: 0px;--surface-bg: #fff;--surface-border-radius: 0rem;--button-border-radius: 0rem}:host{position:relative;outline:none;padding:.625rem 1rem;font-weight:500;font-size:.875rem;line-height:1.4285714286}:host[disabled]{opacity:.5;pointer-events:none}:host(.button-primary){background-color:var(--color-primary);color:#fff}:host(.button-primary):hover{background-color:var(--color-brand-600)}:host(.button-primary):focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-primary)}:host(.button-primary):active{background-color:var(--color-brand-800)}:host(.button-danger){background-color:var(--color-red-500);color:#fff}:host(.button-danger):hover{background-color:var(--color-red-600)}:host(.button-danger):focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-red-500)}:host(.button-danger):active{background-color:var(--color-red-700)}:host(.button-warning){background-color:var(--color-yellow-500);color:#fff}:host(.button-warning):hover{background-color:var(--color-yellow-600)}:host(.button-warning):focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-yellow-500)}:host(.button-warning):active{background-color:var(--color-yellow-700)}:host(.button-secondary){background-color:var(--color-neutral-200);color:var(--color-neutral-700)}:host(.button-secondary):hover{background-color:rgb(from var(--color-neutral-200) r r b/65%)}:host(.button-secondary):focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-primary)}:host(.button-secondary):active{background:var(--color-neutral-300)}:host(.button-subtle){color:var(--color-neutral-700)}:host(.button-subtle):hover{background-color:rgb(from var(--color-neutral-200) r r b/65%)}:host(.button-subtle):focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-primary)}:host(.button-subtle):active{background-color:var(--color-neutral-300)}:host.busy{cursor:wait}:host.busy .button--label{color:transparent}.button--label{display:flex;align-items:center;gap:.25rem}.button--loading{position:absolute;z-index:0;inset:0;display:flex;justify-content:center}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.button--loading-spinner{height:1.25rem;width:1.25rem;margin:auto;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"] }); }
|
|
888
888
|
}
|
|
889
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
889
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzButton, decorators: [{
|
|
890
890
|
type: Component,
|
|
891
891
|
args: [{ selector: 'button[mz-button], a[mz-button], button[mzButton], a[mzButton]', imports: [], template: "@if(busy()) {\n<span class=\"button--loading\">\n <svg class=\"button--loading-spinner\" xmlns=\"http://www.w3.org/2000/svg\" 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\" 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\"></path>\n </svg>\n</span>\n}\n<span class=\"button--label\">\n <ng-content></ng-content>\n</span>\n", styles: [":root{--color-primary: #1d4ed8;--color-secondary: #374151;--color-success: #15803d;--color-danger: #b91c1c;--color-warning: #a16207;--color-neutral-50: #f9fafb;--color-neutral-100: #f3f4f6;--color-neutral-200: #e5e7eb;--color-neutral-300: #d1d5db;--color-neutral-400: #9ca3af;--color-neutral-500: #6b7280;--color-neutral-600: #4b5563;--color-neutral-700: #374151;--color-neutral-800: #1f2937;--color-neutral-900: #111827;--color-neutral-950: #030712;--color-brand-50: #eff6ff;--color-brand-100: #dbeafe;--color-brand-200: #bfdbfe;--color-brand-300: #93c5fd;--color-brand-400: #60a5fa;--color-brand-500: #3b82f6;--color-brand-600: #2563eb;--color-brand-700: #1d4ed8;--color-brand-800: #1e40af;--color-brand-900: #1e3a8a;--color-brand-950: #172554;--color-green-50: #f0fdf4;--color-green-100: #dcfce7;--color-green-200: #bbf7d0;--color-green-300: #86efac;--color-green-400: #4ade80;--color-green-500: #22c55e;--color-green-600: #16a34a;--color-green-700: #15803d;--color-green-800: #166534;--color-green-900: #14532d;--color-green-950: #052e16;--color-red-50: #fef2f2;--color-red-100: #fee2e2;--color-red-200: #fecaca;--color-red-300: #fca5a5;--color-red-400: #f87171;--color-red-500: #ef4444;--color-red-600: #dc2626;--color-red-700: #b91c1c;--color-red-800: #991b1b;--color-red-900: #7f1d1d;--color-red-950: #450a0a;--color-yellow-50: #fefce8;--color-yellow-100: #fef9c3;--color-yellow-200: #fef08a;--color-yellow-300: #fde047;--color-yellow-400: #facc15;--color-yellow-500: #eab308;--color-yellow-600: #ca8a04;--color-yellow-700: #a16207;--color-yellow-800: #854d0e;--color-yellow-900: #713f12;--color-yellow-950: #422006;--border-radius: 0px;--surface-bg: #fff;--surface-border-radius: 0rem;--button-border-radius: 0rem}:host{position:relative;outline:none;padding:.625rem 1rem;font-weight:500;font-size:.875rem;line-height:1.4285714286}:host[disabled]{opacity:.5;pointer-events:none}:host(.button-primary){background-color:var(--color-primary);color:#fff}:host(.button-primary):hover{background-color:var(--color-brand-600)}:host(.button-primary):focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-primary)}:host(.button-primary):active{background-color:var(--color-brand-800)}:host(.button-danger){background-color:var(--color-red-500);color:#fff}:host(.button-danger):hover{background-color:var(--color-red-600)}:host(.button-danger):focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-red-500)}:host(.button-danger):active{background-color:var(--color-red-700)}:host(.button-warning){background-color:var(--color-yellow-500);color:#fff}:host(.button-warning):hover{background-color:var(--color-yellow-600)}:host(.button-warning):focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-yellow-500)}:host(.button-warning):active{background-color:var(--color-yellow-700)}:host(.button-secondary){background-color:var(--color-neutral-200);color:var(--color-neutral-700)}:host(.button-secondary):hover{background-color:rgb(from var(--color-neutral-200) r r b/65%)}:host(.button-secondary):focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-primary)}:host(.button-secondary):active{background:var(--color-neutral-300)}:host(.button-subtle){color:var(--color-neutral-700)}:host(.button-subtle):hover{background-color:rgb(from var(--color-neutral-200) r r b/65%)}:host(.button-subtle):focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-primary)}:host(.button-subtle):active{background-color:var(--color-neutral-300)}:host.busy{cursor:wait}:host.busy .button--label{color:transparent}.button--label{display:flex;align-items:center;gap:.25rem}.button--loading{position:absolute;z-index:0;inset:0;display:flex;justify-content:center}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.button--loading-spinner{height:1.25rem;width:1.25rem;margin:auto;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}\n"] }]
|
|
892
892
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { elementClass: [{
|
|
@@ -932,10 +932,10 @@ class MzInlineEditComponent {
|
|
|
932
932
|
this.isEditing = false;
|
|
933
933
|
this.busy = false;
|
|
934
934
|
}
|
|
935
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
936
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
935
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzInlineEditComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
936
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", 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\" mz-button [busy]=\"busy\" (click)=\"submitForm()\">Save</button>\n <button type=\"button\" mz-button appearance=\"subtle\" (click)=\"cancelEdit()\">Cancel</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: "component", type: MzButton, selector: "button[mz-button], a[mz-button], button[mzButton], a[mzButton]", inputs: ["appearance", "busy", "disabled"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.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"] }] }); }
|
|
937
937
|
}
|
|
938
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
938
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzInlineEditComponent, decorators: [{
|
|
939
939
|
type: Component,
|
|
940
940
|
args: [{ selector: 'mz-inline-edit', imports: [MzButton, 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\" mz-button [busy]=\"busy\" (click)=\"submitForm()\">Save</button>\n <button type=\"button\" mz-button appearance=\"subtle\" (click)=\"cancelEdit()\">Cancel</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"] }]
|
|
941
941
|
}], ctorParameters: () => [{ type: i0.Renderer2 }], propDecorators: { label: [{
|
|
@@ -1098,10 +1098,10 @@ class MzDrawerContainer extends CdkDialogContainer {
|
|
|
1098
1098
|
// for animation purposes
|
|
1099
1099
|
element.classList.add('open');
|
|
1100
1100
|
}
|
|
1101
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1102
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1101
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawerContainer, deps: [{ token: i0.ElementRef }, { token: i1$4.FocusTrapFactory }, { token: MzDrawerConfig }, { token: i1$4.InteractivityChecker }, { token: i0.NgZone }, { token: i3.OverlayRef }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1102
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: MzDrawerContainer, isStandalone: true, selector: "mz-drawer-container", host: { listeners: { "window:beforeunload": "onBeforeUnload($event)" }, classAttribute: "mz-drawer-container" }, usesInheritance: true, ngImport: i0, template: "<ng-template cdkPortalOutlet />\n", styles: [".mz-drawer-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%}.mz-drawer-container.open{translate:0%}.mz-drawer-component{display:flex;flex-direction:column;height:100%}\n"], dependencies: [{ kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1103
1103
|
}
|
|
1104
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1104
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawerContainer, decorators: [{
|
|
1105
1105
|
type: Component,
|
|
1106
1106
|
args: [{ selector: 'mz-drawer-container', imports: [CdkPortalOutlet], encapsulation: ViewEncapsulation.None, host: {
|
|
1107
1107
|
'class': 'mz-drawer-container'
|
|
@@ -1264,10 +1264,10 @@ class MzDrawer {
|
|
|
1264
1264
|
dialogs[i].close();
|
|
1265
1265
|
}
|
|
1266
1266
|
}
|
|
1267
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1268
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1267
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawer, deps: [{ token: i0.Injector }, { token: i3.Overlay }, { token: DEFAULT_MZ_DRAWER_CONFIG, optional: true }, { token: i0.ViewContainerRef, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1268
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawer, providedIn: 'root' }); }
|
|
1269
1269
|
}
|
|
1270
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1270
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawer, decorators: [{
|
|
1271
1271
|
type: Injectable,
|
|
1272
1272
|
args: [{
|
|
1273
1273
|
providedIn: 'root',
|
|
@@ -1284,7 +1284,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
|
|
|
1284
1284
|
class MzDrawerHeader {
|
|
1285
1285
|
constructor(drawerRef) {
|
|
1286
1286
|
this.drawerRef = drawerRef;
|
|
1287
|
-
this.title = input('');
|
|
1287
|
+
this.title = input('', ...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
1288
1288
|
}
|
|
1289
1289
|
close(e) {
|
|
1290
1290
|
this.drawerRef.tryClose(undefined, { focusOrigin: e.detail === 0 ? 'keyboard' : 'mouse' });
|
|
@@ -1292,10 +1292,10 @@ class MzDrawerHeader {
|
|
|
1292
1292
|
get disableClose() {
|
|
1293
1293
|
return this.drawerRef.disableClose ?? false;
|
|
1294
1294
|
}
|
|
1295
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1296
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1295
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawerHeader, deps: [{ token: MzDrawerRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1296
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: MzDrawerHeader, isStandalone: true, selector: "mz-drawer-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "mz-drawer-header" }, ngImport: i0, template: "<h2>{{ title() }}</h2>\n@if(!disableClose){\n<div>\n <button class=\"button-close\" (click)=\"close($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</div>\n}", styles: [":host{display:flex;padding:.75rem 1.5rem}h2{flex:1}.button-close{height:1.5rem;width:1.5rem;display:inline-block}\n"] }); }
|
|
1297
1297
|
}
|
|
1298
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1298
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawerHeader, decorators: [{
|
|
1299
1299
|
type: Component,
|
|
1300
1300
|
args: [{ selector: 'mz-drawer-header', imports: [], host: {
|
|
1301
1301
|
'class': 'mz-drawer-header'
|
|
@@ -1303,10 +1303,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
|
|
|
1303
1303
|
}], ctorParameters: () => [{ type: MzDrawerRef }] });
|
|
1304
1304
|
|
|
1305
1305
|
class MzDrawerContent {
|
|
1306
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1307
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1306
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawerContent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1307
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: MzDrawerContent, isStandalone: true, selector: "mz-drawer-content", host: { classAttribute: "mz-drawer-content" }, ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{flex:1;overflow:auto;padding:.5rem 1.5rem}\n"] }); }
|
|
1308
1308
|
}
|
|
1309
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1309
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawerContent, decorators: [{
|
|
1310
1310
|
type: Component,
|
|
1311
1311
|
args: [{ selector: 'mz-drawer-content', imports: [], host: {
|
|
1312
1312
|
'class': 'mz-drawer-content'
|
|
@@ -1314,10 +1314,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
|
|
|
1314
1314
|
}] });
|
|
1315
1315
|
|
|
1316
1316
|
class MzDrawerFooter {
|
|
1317
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1318
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1317
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawerFooter, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1318
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: MzDrawerFooter, isStandalone: true, selector: "mz-drawer-footer", host: { classAttribute: "mz-drawer-footer" }, ngImport: i0, template: "<div class=\"drawer-projected\">\n <ng-content></ng-content>\n</div>", styles: [":host{display:flex;padding:.75rem 1.5rem;flex-wrap:wrap}.drawer-projected{flex:1 1 100%}\n"] }); }
|
|
1319
1319
|
}
|
|
1320
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1320
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawerFooter, decorators: [{
|
|
1321
1321
|
type: Component,
|
|
1322
1322
|
args: [{ selector: 'mz-drawer-footer', imports: [], host: {
|
|
1323
1323
|
'class': 'mz-drawer-footer'
|
|
@@ -1325,15 +1325,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
|
|
|
1325
1325
|
}] });
|
|
1326
1326
|
|
|
1327
1327
|
class MzDrawerModule {
|
|
1328
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1329
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1328
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1329
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: MzDrawerModule, imports: [DialogModule, OverlayModule, PortalModule, MzDrawerContainer, MzDrawerHeader, MzDrawerContent, MzDrawerFooter], exports: [DialogModule,
|
|
1330
1330
|
MzDrawerContainer,
|
|
1331
1331
|
MzDrawerHeader,
|
|
1332
1332
|
MzDrawerContent,
|
|
1333
1333
|
MzDrawerFooter] }); }
|
|
1334
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1334
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawerModule, providers: [MzDrawer], imports: [DialogModule, OverlayModule, PortalModule, DialogModule] }); }
|
|
1335
1335
|
}
|
|
1336
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1336
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDrawerModule, decorators: [{
|
|
1337
1337
|
type: NgModule,
|
|
1338
1338
|
args: [{
|
|
1339
1339
|
imports: [DialogModule, OverlayModule, PortalModule, MzDrawerContainer, MzDrawerHeader, MzDrawerContent, MzDrawerFooter],
|
|
@@ -1365,10 +1365,10 @@ class MzDialogContainer extends CdkDialogContainer {
|
|
|
1365
1365
|
const html = this.elementRef.nativeElement;
|
|
1366
1366
|
html.classList.add('open');
|
|
1367
1367
|
}
|
|
1368
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1369
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1368
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialogContainer, deps: [{ token: i0.ElementRef }, { token: i1$4.FocusTrapFactory }, { token: i1$5.DialogConfig }, { token: i1$4.InteractivityChecker }, { token: i0.NgZone }, { token: i3.OverlayRef }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1369
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: MzDialogContainer, isStandalone: true, selector: "mz-dialog-container", host: { classAttribute: "mz-dialog-container" }, usesInheritance: true, ngImport: i0, template: "<ng-template cdkPortalOutlet></ng-template>", styles: [".mz-dialog-container{background-color:var(--surface-bg);padding:1rem;width:100%;height:100%;opacity:0;transition:opacity linear .2s}.mz-dialog-container.open{opacity:1}\n"], dependencies: [{ kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1370
1370
|
}
|
|
1371
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1371
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialogContainer, decorators: [{
|
|
1372
1372
|
type: Component,
|
|
1373
1373
|
args: [{ selector: 'mz-dialog-container', imports: [CdkPortalOutlet], encapsulation: ViewEncapsulation.None, host: {
|
|
1374
1374
|
class: 'mz-dialog-container',
|
|
@@ -1382,30 +1382,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
|
|
|
1382
1382
|
|
|
1383
1383
|
class MzDialogHeader {
|
|
1384
1384
|
constructor() {
|
|
1385
|
-
this.title = input('');
|
|
1385
|
+
this.title = input('', ...(ngDevMode ? [{ debugName: "title" }] : []));
|
|
1386
1386
|
}
|
|
1387
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1388
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "
|
|
1387
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialogHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1388
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.4", type: MzDialogHeader, isStandalone: true, selector: "mz-dialog-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<h2>{{ title() }}</h2>\n", styles: [":root{--color-primary: #1d4ed8;--color-secondary: #374151;--color-success: #15803d;--color-danger: #b91c1c;--color-warning: #a16207;--color-neutral-50: #f9fafb;--color-neutral-100: #f3f4f6;--color-neutral-200: #e5e7eb;--color-neutral-300: #d1d5db;--color-neutral-400: #9ca3af;--color-neutral-500: #6b7280;--color-neutral-600: #4b5563;--color-neutral-700: #374151;--color-neutral-800: #1f2937;--color-neutral-900: #111827;--color-neutral-950: #030712;--color-brand-50: #eff6ff;--color-brand-100: #dbeafe;--color-brand-200: #bfdbfe;--color-brand-300: #93c5fd;--color-brand-400: #60a5fa;--color-brand-500: #3b82f6;--color-brand-600: #2563eb;--color-brand-700: #1d4ed8;--color-brand-800: #1e40af;--color-brand-900: #1e3a8a;--color-brand-950: #172554;--color-green-50: #f0fdf4;--color-green-100: #dcfce7;--color-green-200: #bbf7d0;--color-green-300: #86efac;--color-green-400: #4ade80;--color-green-500: #22c55e;--color-green-600: #16a34a;--color-green-700: #15803d;--color-green-800: #166534;--color-green-900: #14532d;--color-green-950: #052e16;--color-red-50: #fef2f2;--color-red-100: #fee2e2;--color-red-200: #fecaca;--color-red-300: #fca5a5;--color-red-400: #f87171;--color-red-500: #ef4444;--color-red-600: #dc2626;--color-red-700: #b91c1c;--color-red-800: #991b1b;--color-red-900: #7f1d1d;--color-red-950: #450a0a;--color-yellow-50: #fefce8;--color-yellow-100: #fef9c3;--color-yellow-200: #fef08a;--color-yellow-300: #fde047;--color-yellow-400: #facc15;--color-yellow-500: #eab308;--color-yellow-600: #ca8a04;--color-yellow-700: #a16207;--color-yellow-800: #854d0e;--color-yellow-900: #713f12;--color-yellow-950: #422006;--border-radius: 0px;--surface-bg: #fff;--surface-border-radius: 0rem;--button-border-radius: 0rem}:host{display:flex;padding:.5rem;gap:.5rem}h2{flex:1}\n"] }); }
|
|
1389
1389
|
}
|
|
1390
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1390
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialogHeader, decorators: [{
|
|
1391
1391
|
type: Component,
|
|
1392
1392
|
args: [{ selector: 'mz-dialog-header', template: "<h2>{{ title() }}</h2>\n", styles: [":root{--color-primary: #1d4ed8;--color-secondary: #374151;--color-success: #15803d;--color-danger: #b91c1c;--color-warning: #a16207;--color-neutral-50: #f9fafb;--color-neutral-100: #f3f4f6;--color-neutral-200: #e5e7eb;--color-neutral-300: #d1d5db;--color-neutral-400: #9ca3af;--color-neutral-500: #6b7280;--color-neutral-600: #4b5563;--color-neutral-700: #374151;--color-neutral-800: #1f2937;--color-neutral-900: #111827;--color-neutral-950: #030712;--color-brand-50: #eff6ff;--color-brand-100: #dbeafe;--color-brand-200: #bfdbfe;--color-brand-300: #93c5fd;--color-brand-400: #60a5fa;--color-brand-500: #3b82f6;--color-brand-600: #2563eb;--color-brand-700: #1d4ed8;--color-brand-800: #1e40af;--color-brand-900: #1e3a8a;--color-brand-950: #172554;--color-green-50: #f0fdf4;--color-green-100: #dcfce7;--color-green-200: #bbf7d0;--color-green-300: #86efac;--color-green-400: #4ade80;--color-green-500: #22c55e;--color-green-600: #16a34a;--color-green-700: #15803d;--color-green-800: #166534;--color-green-900: #14532d;--color-green-950: #052e16;--color-red-50: #fef2f2;--color-red-100: #fee2e2;--color-red-200: #fecaca;--color-red-300: #fca5a5;--color-red-400: #f87171;--color-red-500: #ef4444;--color-red-600: #dc2626;--color-red-700: #b91c1c;--color-red-800: #991b1b;--color-red-900: #7f1d1d;--color-red-950: #450a0a;--color-yellow-50: #fefce8;--color-yellow-100: #fef9c3;--color-yellow-200: #fef08a;--color-yellow-300: #fde047;--color-yellow-400: #facc15;--color-yellow-500: #eab308;--color-yellow-600: #ca8a04;--color-yellow-700: #a16207;--color-yellow-800: #854d0e;--color-yellow-900: #713f12;--color-yellow-950: #422006;--border-radius: 0px;--surface-bg: #fff;--surface-border-radius: 0rem;--button-border-radius: 0rem}:host{display:flex;padding:.5rem;gap:.5rem}h2{flex:1}\n"] }]
|
|
1393
1393
|
}], ctorParameters: () => [] });
|
|
1394
1394
|
|
|
1395
1395
|
class MzDialogFooter {
|
|
1396
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1397
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1396
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialogFooter, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1397
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: MzDialogFooter, isStandalone: true, selector: "mz-dialog-footer", ngImport: i0, template: "<ng-content></ng-content>", styles: [":root{--color-primary: #1d4ed8;--color-secondary: #374151;--color-success: #15803d;--color-danger: #b91c1c;--color-warning: #a16207;--color-neutral-50: #f9fafb;--color-neutral-100: #f3f4f6;--color-neutral-200: #e5e7eb;--color-neutral-300: #d1d5db;--color-neutral-400: #9ca3af;--color-neutral-500: #6b7280;--color-neutral-600: #4b5563;--color-neutral-700: #374151;--color-neutral-800: #1f2937;--color-neutral-900: #111827;--color-neutral-950: #030712;--color-brand-50: #eff6ff;--color-brand-100: #dbeafe;--color-brand-200: #bfdbfe;--color-brand-300: #93c5fd;--color-brand-400: #60a5fa;--color-brand-500: #3b82f6;--color-brand-600: #2563eb;--color-brand-700: #1d4ed8;--color-brand-800: #1e40af;--color-brand-900: #1e3a8a;--color-brand-950: #172554;--color-green-50: #f0fdf4;--color-green-100: #dcfce7;--color-green-200: #bbf7d0;--color-green-300: #86efac;--color-green-400: #4ade80;--color-green-500: #22c55e;--color-green-600: #16a34a;--color-green-700: #15803d;--color-green-800: #166534;--color-green-900: #14532d;--color-green-950: #052e16;--color-red-50: #fef2f2;--color-red-100: #fee2e2;--color-red-200: #fecaca;--color-red-300: #fca5a5;--color-red-400: #f87171;--color-red-500: #ef4444;--color-red-600: #dc2626;--color-red-700: #b91c1c;--color-red-800: #991b1b;--color-red-900: #7f1d1d;--color-red-950: #450a0a;--color-yellow-50: #fefce8;--color-yellow-100: #fef9c3;--color-yellow-200: #fef08a;--color-yellow-300: #fde047;--color-yellow-400: #facc15;--color-yellow-500: #eab308;--color-yellow-600: #ca8a04;--color-yellow-700: #a16207;--color-yellow-800: #854d0e;--color-yellow-900: #713f12;--color-yellow-950: #422006;--border-radius: 0px;--surface-bg: #fff;--surface-border-radius: 0rem;--button-border-radius: 0rem}:host{padding:1rem .5rem .5rem;display:flex;justify-content:flex-end;gap:.5rem}\n"] }); }
|
|
1398
1398
|
}
|
|
1399
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1399
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialogFooter, decorators: [{
|
|
1400
1400
|
type: Component,
|
|
1401
1401
|
args: [{ selector: 'mz-dialog-footer', imports: [], template: "<ng-content></ng-content>", styles: [":root{--color-primary: #1d4ed8;--color-secondary: #374151;--color-success: #15803d;--color-danger: #b91c1c;--color-warning: #a16207;--color-neutral-50: #f9fafb;--color-neutral-100: #f3f4f6;--color-neutral-200: #e5e7eb;--color-neutral-300: #d1d5db;--color-neutral-400: #9ca3af;--color-neutral-500: #6b7280;--color-neutral-600: #4b5563;--color-neutral-700: #374151;--color-neutral-800: #1f2937;--color-neutral-900: #111827;--color-neutral-950: #030712;--color-brand-50: #eff6ff;--color-brand-100: #dbeafe;--color-brand-200: #bfdbfe;--color-brand-300: #93c5fd;--color-brand-400: #60a5fa;--color-brand-500: #3b82f6;--color-brand-600: #2563eb;--color-brand-700: #1d4ed8;--color-brand-800: #1e40af;--color-brand-900: #1e3a8a;--color-brand-950: #172554;--color-green-50: #f0fdf4;--color-green-100: #dcfce7;--color-green-200: #bbf7d0;--color-green-300: #86efac;--color-green-400: #4ade80;--color-green-500: #22c55e;--color-green-600: #16a34a;--color-green-700: #15803d;--color-green-800: #166534;--color-green-900: #14532d;--color-green-950: #052e16;--color-red-50: #fef2f2;--color-red-100: #fee2e2;--color-red-200: #fecaca;--color-red-300: #fca5a5;--color-red-400: #f87171;--color-red-500: #ef4444;--color-red-600: #dc2626;--color-red-700: #b91c1c;--color-red-800: #991b1b;--color-red-900: #7f1d1d;--color-red-950: #450a0a;--color-yellow-50: #fefce8;--color-yellow-100: #fef9c3;--color-yellow-200: #fef08a;--color-yellow-300: #fde047;--color-yellow-400: #facc15;--color-yellow-500: #eab308;--color-yellow-600: #ca8a04;--color-yellow-700: #a16207;--color-yellow-800: #854d0e;--color-yellow-900: #713f12;--color-yellow-950: #422006;--border-radius: 0px;--surface-bg: #fff;--surface-border-radius: 0rem;--button-border-radius: 0rem}:host{padding:1rem .5rem .5rem;display:flex;justify-content:flex-end;gap:.5rem}\n"] }]
|
|
1402
1402
|
}] });
|
|
1403
1403
|
|
|
1404
1404
|
class MzDialogContent {
|
|
1405
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1406
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1405
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialogContent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1406
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: MzDialogContent, isStandalone: true, selector: "mz-dialog-content", ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{max-height:80vh;max-width:80vh;min-width:24rem;display:block;overflow:auto;padding:1rem .5rem 2rem}\n"] }); }
|
|
1407
1407
|
}
|
|
1408
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1408
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialogContent, decorators: [{
|
|
1409
1409
|
type: Component,
|
|
1410
1410
|
args: [{ selector: 'mz-dialog-content', imports: [], template: "<ng-content></ng-content>", styles: [":host{max-height:80vh;max-width:80vh;min-width:24rem;display:block;overflow:auto;padding:1rem .5rem 2rem}\n"] }]
|
|
1411
1411
|
}] });
|
|
@@ -1421,10 +1421,10 @@ class MzMessageDialog {
|
|
|
1421
1421
|
close() {
|
|
1422
1422
|
this.dialogRef.close(false);
|
|
1423
1423
|
}
|
|
1424
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1425
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1424
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzMessageDialog, deps: [{ token: i1$5.DialogRef }, { token: DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1425
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", type: MzMessageDialog, isStandalone: true, selector: "mz-message-dialog", ngImport: i0, template: "<mz-dialog-header [title]=\"data.title\"></mz-dialog-header>\n<mz-dialog-content>\n {{ data.message }}\n</mz-dialog-content>\n<mz-dialog-footer>\n @if(data.cancelAction.length > 0 ) {\n <button (click)=\"close()\" mz-button appearance=\"subtle\">{{ data.cancelAction }}</button>\n } @if(data.action.length > 0) {\n <button (click)=\"ok()\" cdkFocusInitial mz-button [appearance]=\"data.appearance || 'primary'\">{{ data.action }}</button>\n }\n</mz-dialog-footer>\n", styles: [""], dependencies: [{ kind: "component", type: MzDialogHeader, selector: "mz-dialog-header", inputs: ["title"] }, { kind: "component", type: MzDialogFooter, selector: "mz-dialog-footer" }, { kind: "component", type: MzButton, selector: "button[mz-button], a[mz-button], button[mzButton], a[mzButton]", inputs: ["appearance", "busy", "disabled"] }, { kind: "component", type: MzDialogContent, selector: "mz-dialog-content" }] }); }
|
|
1426
1426
|
}
|
|
1427
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1427
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzMessageDialog, decorators: [{
|
|
1428
1428
|
type: Component,
|
|
1429
1429
|
args: [{ selector: 'mz-message-dialog', imports: [MzDialogHeader, MzDialogFooter, MzButton, MzDialogContent], template: "<mz-dialog-header [title]=\"data.title\"></mz-dialog-header>\n<mz-dialog-content>\n {{ data.message }}\n</mz-dialog-content>\n<mz-dialog-footer>\n @if(data.cancelAction.length > 0 ) {\n <button (click)=\"close()\" mz-button appearance=\"subtle\">{{ data.cancelAction }}</button>\n } @if(data.action.length > 0) {\n <button (click)=\"ok()\" cdkFocusInitial mz-button [appearance]=\"data.appearance || 'primary'\">{{ data.action }}</button>\n }\n</mz-dialog-footer>\n" }]
|
|
1430
1430
|
}], ctorParameters: () => [{ type: i1$5.DialogRef }, { type: undefined, decorators: [{
|
|
@@ -1522,10 +1522,10 @@ class MzDialog {
|
|
|
1522
1522
|
const ref = this.cdkDialog.open(templateOrComponent, dialogConfig);
|
|
1523
1523
|
return ref;
|
|
1524
1524
|
}
|
|
1525
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1526
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1525
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialog, deps: [{ token: i0.Injector }, { token: MZ_DIALOG_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1526
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialog, providedIn: 'root' }); }
|
|
1527
1527
|
}
|
|
1528
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1528
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialog, decorators: [{
|
|
1529
1529
|
type: Injectable,
|
|
1530
1530
|
args: [{
|
|
1531
1531
|
providedIn: 'root',
|
|
@@ -1538,16 +1538,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.8", ngImpor
|
|
|
1538
1538
|
}] }] });
|
|
1539
1539
|
|
|
1540
1540
|
class MzDialogModule {
|
|
1541
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1542
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1541
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1542
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.4", ngImport: i0, type: MzDialogModule, imports: [DialogModule, OverlayModule, MzDialogContainer, MzDialogHeader, MzDialogContent, MzDialogFooter, MzMessageDialog], exports: [DialogModule,
|
|
1543
1543
|
MzDialogHeader,
|
|
1544
1544
|
MzDialogContent,
|
|
1545
1545
|
MzDialogFooter,
|
|
1546
1546
|
MzDialogContainer,
|
|
1547
1547
|
MzMessageDialog] }); }
|
|
1548
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1548
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialogModule, providers: [MzDialog], imports: [DialogModule, OverlayModule, DialogModule] }); }
|
|
1549
1549
|
}
|
|
1550
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1550
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: MzDialogModule, decorators: [{
|
|
1551
1551
|
type: NgModule,
|
|
1552
1552
|
args: [{
|
|
1553
1553
|
imports: [DialogModule, OverlayModule, MzDialogContainer, MzDialogHeader, MzDialogContent, MzDialogFooter, MzMessageDialog],
|
|
@@ -1592,10 +1592,10 @@ class FilterComponent {
|
|
|
1592
1592
|
}
|
|
1593
1593
|
return this.label;
|
|
1594
1594
|
}
|
|
1595
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1596
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1595
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1596
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: FilterComponent, isStandalone: true, selector: "mz-filter", inputs: { label: "label", display: "display", menuTemplate: "menuTemplate" }, outputs: { clear: "clear", apply: "apply" }, viewQueries: [{ propertyName: "menuForm", first: true, predicate: NgForm, descendants: true }, { propertyName: "menuTrigger", first: true, predicate: CdkMenuTrigger, descendants: true }], exportAs: ["mzFilter"], ngImport: i0, template: "<button [cdkMenuTriggerFor]=\"filterMenu\" class=\"mz-filter-button\">{{filterLabel}}<mz-svg-icon key=\"chevron-down-control\"></mz-svg-icon></button>\n<ng-template #filterMenu>\n <div cdkMenu class=\"mz-dropdown-body\">\n <ng-container [ngTemplateOutlet]=\"menuTemplate\"></ng-container>\n </div>\n</ng-template>\n\n", styles: [".mz-filter-button{display:inline-flex;position:relative;padding:.625rem 1rem;gap:.5rem;align-items:center;font-size:.875rem;line-height:1.25rem;font-weight:500;border-radius:var(--border-radius);cursor:pointer;border:1px solid var(--color-neutral-300);padding:.5rem .75rem}.mz-filter-button[aria-expanded=true]{background-color:var(--color-neutral-200)}.mz-dropdown-body{background-color:var(--surface-bg);min-width:5rem;margin-top:.25rem;padding:.75rem;border-radius:var(--surface-border-radius);border:1px solid var(--color-neutral-300);--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05) !important;--tw-shadow-colored: 0 1px 2px 0 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;font-size:.875rem}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: CdkMenuModule }, { kind: "directive", type: i2.CdkMenu, selector: "[cdkMenu]", outputs: ["closed"], exportAs: ["cdkMenu"] }, { kind: "directive", type: i2.CdkMenuTrigger, selector: "[cdkMenuTriggerFor]", inputs: ["cdkMenuTriggerFor", "cdkMenuPosition", "cdkMenuTriggerData"], outputs: ["cdkMenuOpened", "cdkMenuClosed"], exportAs: ["cdkMenuTriggerFor"] }, { kind: "component", type: SvgIconComponent, selector: "mz-svg-icon", inputs: ["key", "type", "size"] }] }); }
|
|
1597
1597
|
}
|
|
1598
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1598
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FilterComponent, decorators: [{
|
|
1599
1599
|
type: Component,
|
|
1600
1600
|
args: [{ selector: 'mz-filter', exportAs: 'mzFilter', imports: [FormsModule, CommonModule, CdkMenuModule, SvgIconComponent], template: "<button [cdkMenuTriggerFor]=\"filterMenu\" class=\"mz-filter-button\">{{filterLabel}}<mz-svg-icon key=\"chevron-down-control\"></mz-svg-icon></button>\n<ng-template #filterMenu>\n <div cdkMenu class=\"mz-dropdown-body\">\n <ng-container [ngTemplateOutlet]=\"menuTemplate\"></ng-container>\n </div>\n</ng-template>\n\n", styles: [".mz-filter-button{display:inline-flex;position:relative;padding:.625rem 1rem;gap:.5rem;align-items:center;font-size:.875rem;line-height:1.25rem;font-weight:500;border-radius:var(--border-radius);cursor:pointer;border:1px solid var(--color-neutral-300);padding:.5rem .75rem}.mz-filter-button[aria-expanded=true]{background-color:var(--color-neutral-200)}.mz-dropdown-body{background-color:var(--surface-bg);min-width:5rem;margin-top:.25rem;padding:.75rem;border-radius:var(--surface-border-radius);border:1px solid var(--color-neutral-300);--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05) !important;--tw-shadow-colored: 0 1px 2px 0 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;font-size:.875rem}\n"] }]
|
|
1601
1601
|
}], propDecorators: { label: [{
|
|
@@ -1655,10 +1655,10 @@ class OptionsFilterComponent {
|
|
|
1655
1655
|
dismiss() {
|
|
1656
1656
|
this.open = false;
|
|
1657
1657
|
}
|
|
1658
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1659
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1658
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: OptionsFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1659
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.4", 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()\" mz-button [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\" mz-button appearance=\"subtle\" (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);border:1px solid var(--color-neutral-300);--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05) !important;--tw-shadow-colored: 0 1px 2px 0 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;font-size:.875rem}.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$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.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$3.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$3.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: MzSpinner, selector: "mz-spinner", inputs: ["size", "appearance"] }, { kind: "component", type: MzButton, selector: "button[mz-button], a[mz-button], button[mzButton], a[mzButton]", inputs: ["appearance", "busy", "disabled"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
1660
1660
|
}
|
|
1661
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1661
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: OptionsFilterComponent, decorators: [{
|
|
1662
1662
|
type: Component,
|
|
1663
1663
|
args: [{ selector: 'mz-options-filter', imports: [FormsModule, CdkOverlayOrigin, CdkConnectedOverlay, MzSpinner, MzButton], encapsulation: ViewEncapsulation.None, template: "<button cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\" (click)=\"toggleOverlay()\" mz-button [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\" mz-button appearance=\"subtle\" (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);border:1px solid var(--color-neutral-300);--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05) !important;--tw-shadow-colored: 0 1px 2px 0 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;font-size:.875rem}.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"] }]
|
|
1664
1664
|
}], propDecorators: { options: [{
|
|
@@ -1698,10 +1698,10 @@ class FilterMenuComponent {
|
|
|
1698
1698
|
}
|
|
1699
1699
|
clear() {
|
|
1700
1700
|
}
|
|
1701
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1702
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1701
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FilterMenuComponent, deps: [{ token: FilterComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1702
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.4", type: FilterMenuComponent, isStandalone: true, selector: "mz-filter-menu", host: { classAttribute: "menu" }, queries: [{ propertyName: "form", first: true, predicate: NgForm, descendants: true }, { propertyName: "models", predicate: NgModel, descendants: true }], viewQueries: [{ propertyName: "myTemplate", first: true, predicate: ["myTemplate"], descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef }], exportAs: ["mzFilterMenu"], ngImport: i0, template: "<ng-content></ng-content>\n<div class=\"button-list\">\n <button type=\"submit\" mz-button appearance=\"primary\" (click)=\"apply()\">Apply</button>\n <button type=\"reset\" mz-button appearance=\"subtle\" (click)=\"clear()\">Clear</button>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: MzButton, selector: "button[mz-button], a[mz-button], button[mzButton], a[mzButton]", inputs: ["appearance", "busy", "disabled"] }] }); }
|
|
1703
1703
|
}
|
|
1704
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1704
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.4", ngImport: i0, type: FilterMenuComponent, decorators: [{
|
|
1705
1705
|
type: Component,
|
|
1706
1706
|
args: [{ selector: 'mz-filter-menu', imports: [FormsModule, MzButton], exportAs: 'mzFilterMenu', hostDirectives: [], host: {
|
|
1707
1707
|
class: 'menu',
|