@vality/matez 22.0.1-ccdb67f.0 → 22.0.1-e480856.0
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.
|
@@ -612,6 +612,9 @@ function getErrorsTree(control) {
|
|
|
612
612
|
return errors;
|
|
613
613
|
}
|
|
614
614
|
|
|
615
|
+
/**
|
|
616
|
+
* @deprecated Use FormControlValue
|
|
617
|
+
*/
|
|
615
618
|
class AbstractControlSuperclass extends WrappedControlSuperclass {
|
|
616
619
|
_cdr = inject(ChangeDetectorRef);
|
|
617
620
|
_destroyRef = inject(DestroyRef);
|
|
@@ -644,6 +647,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
644
647
|
type: Directive
|
|
645
648
|
}] });
|
|
646
649
|
|
|
650
|
+
/**
|
|
651
|
+
* @deprecated Use FormControlValue
|
|
652
|
+
*/
|
|
647
653
|
class FormGroupSuperclass extends AbstractControlSuperclass {
|
|
648
654
|
emptyValue;
|
|
649
655
|
setDisabledState(_isDisabled) {
|
|
@@ -688,6 +694,9 @@ const createControlProviders = (component) => [
|
|
|
688
694
|
provideValidators(component),
|
|
689
695
|
];
|
|
690
696
|
|
|
697
|
+
/**
|
|
698
|
+
* @deprecated Use FormControlValue
|
|
699
|
+
*/
|
|
691
700
|
class FormControlSuperclass extends AbstractControlSuperclass {
|
|
692
701
|
control = new FormControl();
|
|
693
702
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: FormControlSuperclass, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
|
@@ -697,6 +706,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
697
706
|
type: Directive
|
|
698
707
|
}] });
|
|
699
708
|
|
|
709
|
+
/**
|
|
710
|
+
* @deprecated Use FormControlValue
|
|
711
|
+
*/
|
|
700
712
|
class FormComponentSuperclass extends FormComponentSuperclass$1 {
|
|
701
713
|
_cdr = inject(ChangeDetectorRef);
|
|
702
714
|
_destroyRef = inject(DestroyRef);
|
|
@@ -722,6 +734,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
722
734
|
type: Directive
|
|
723
735
|
}] });
|
|
724
736
|
|
|
737
|
+
/**
|
|
738
|
+
* @deprecated Use FormControlValue
|
|
739
|
+
*/
|
|
725
740
|
class FormArraySuperclass extends FormGroupSuperclass {
|
|
726
741
|
outerToInnerValue(outer) {
|
|
727
742
|
if (hasControls(this.control)) {
|
|
@@ -1167,6 +1182,7 @@ class PagedObservableResource extends ObservableResource {
|
|
|
1167
1182
|
this.initPaged(options);
|
|
1168
1183
|
}
|
|
1169
1184
|
initPaged({ loader, size, ...options }) {
|
|
1185
|
+
this.pagedOptions = { size: size || 20 };
|
|
1170
1186
|
// TODO: fix types
|
|
1171
1187
|
super.init({
|
|
1172
1188
|
params: EMPTY,
|
|
@@ -1181,7 +1197,6 @@ class PagedObservableResource extends ObservableResource {
|
|
|
1181
1197
|
},
|
|
1182
1198
|
map: (value) => value.result,
|
|
1183
1199
|
});
|
|
1184
|
-
this.pagedOptions = { size: size || 20 };
|
|
1185
1200
|
this.hasMore$ = this.accValue$.pipe(map$1((value) => !!value.continuationToken));
|
|
1186
1201
|
this.hasMore = toSignal(this.hasMore$, { initialValue: false });
|
|
1187
1202
|
this.result$ = this.value$;
|
|
@@ -1480,7 +1495,7 @@ class ValueComponent {
|
|
|
1480
1495
|
});
|
|
1481
1496
|
}
|
|
1482
1497
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: ValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1483
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: ValueComponent, isStandalone: true, selector: "v-value", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, lazyValue: { classPropertyName: "lazyValue", publicName: "lazyValue", isSignal: true, isRequired: false, transformFunction: null }, lazyVisible: { classPropertyName: "lazyVisible", publicName: "lazyVisible", isSignal: true, isRequired: false, transformFunction: null }, progress: { classPropertyName: "progress", publicName: "progress", isSignal: true, isRequired: false, transformFunction: null }, inline: { classPropertyName: "inline", publicName: "inline", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, emptySymbol: { classPropertyName: "emptySymbol", publicName: "emptySymbol", isSignal: false, isRequired: false, transformFunction: (v) => (v === false ? '' : typeof v === 'string' ? v : '―') }, highlight: { classPropertyName: "highlight", publicName: "highlight", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { lazyVisible: "lazyVisibleChange" }, host: { properties: { "class.inline": "inline" } }, ngImport: i0, template: "@if (!value() && lazyValue() && !lazyVisible()) {\n <button class=\"button\" mat-icon-button (click)=\"lazyVisible.set(true)\">\n <mat-icon>sync</mat-icon>\n </button>\n} @else {\n @if (value$ | async; as v) {\n <div class=\"flex gap-1 items-center\">\n @if (v.prefix) {\n <button\n class=\"action ml-[-16px]\"\n mat-icon-button\n (click)=\"v.prefix.click ? v.prefix.click($event) : undefined\"\n >\n <mat-icon>{{ v.prefix.icon }}</mat-icon>\n </button>\n }\n <div\n [ngClass]=\"{ wrapper__action: v.click || v.link }\"\n class=\"wrapper\"\n (click)=\"click($event)\"\n >\n @if (v.template) {\n <ng-container *ngTemplateOutlet=\"v.template; context: {}\"></ng-container>\n } @else {\n @if (v.color) {\n <v-tag [color]=\"v.color\">\n <ng-container *ngTemplateOutlet=\"tooltipTemplate\"></ng-container>\n </v-tag>\n } @else {\n <ng-container *ngTemplateOutlet=\"tooltipTemplate\"></ng-container>\n }\n\n <ng-template #tooltipTemplate>\n @if (v.tooltip) {\n <span\n [matTooltip]=\"v.tooltip\"\n class=\"tooltip\"\n matTooltipClass=\"tooltip-content\"\n >\n <ng-container *ngTemplateOutlet=\"valueTemplate\"></ng-container>\n </span>\n } @else {\n <span [title]=\"v.value\">\n <ng-container *ngTemplateOutlet=\"valueTemplate\"></ng-container>\n </span>\n }\n </ng-template>\n\n <ng-template #valueTemplate>\n @switch (v.type) {\n @case ('menu') {\n <v-menu-value [value]=\"v\"></v-menu-value>\n }\n @case ('toggle') {\n <v-toggle-value [value]=\"v\"></v-toggle-value>\n }\n @default {\n @let valueText = valueText$ | async;\n @if (inProgress$ | async) {\n <v-content-loading [hiddenText]=\"valueText\"></v-content-loading>\n } @else if (valueText) {\n <span\n [ngClass]=\"{ value__click: v.click, value__link: v.link }\"\n [vHighlightSearch]=\"highlight\"\n [vHighlightText]=\"valueText\"\n vHighlight\n ></span>\n } @else if (v.error) {\n <mat-icon
|
|
1498
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: ValueComponent, isStandalone: true, selector: "v-value", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, lazyValue: { classPropertyName: "lazyValue", publicName: "lazyValue", isSignal: true, isRequired: false, transformFunction: null }, lazyVisible: { classPropertyName: "lazyVisible", publicName: "lazyVisible", isSignal: true, isRequired: false, transformFunction: null }, progress: { classPropertyName: "progress", publicName: "progress", isSignal: true, isRequired: false, transformFunction: null }, inline: { classPropertyName: "inline", publicName: "inline", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, emptySymbol: { classPropertyName: "emptySymbol", publicName: "emptySymbol", isSignal: false, isRequired: false, transformFunction: (v) => (v === false ? '' : typeof v === 'string' ? v : '―') }, highlight: { classPropertyName: "highlight", publicName: "highlight", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { lazyVisible: "lazyVisibleChange" }, host: { properties: { "class.inline": "inline" } }, ngImport: i0, template: "@if (!value() && lazyValue() && !lazyVisible()) {\n <button class=\"button\" mat-icon-button (click)=\"lazyVisible.set(true)\">\n <mat-icon>sync</mat-icon>\n </button>\n} @else {\n @if (value$ | async; as v) {\n <div class=\"flex gap-1 items-center\">\n @if (v.prefix) {\n <button\n class=\"action ml-[-16px]\"\n mat-icon-button\n (click)=\"v.prefix.click ? v.prefix.click($event) : undefined\"\n >\n <mat-icon>{{ v.prefix.icon }}</mat-icon>\n </button>\n }\n <div\n [ngClass]=\"{ wrapper__action: v.click || v.link }\"\n class=\"wrapper\"\n (click)=\"click($event)\"\n >\n @if (v.template) {\n <ng-container *ngTemplateOutlet=\"v.template; context: {}\"></ng-container>\n } @else {\n @if (v.color) {\n <v-tag [color]=\"v.color\">\n <ng-container *ngTemplateOutlet=\"tooltipTemplate\"></ng-container>\n </v-tag>\n } @else {\n <ng-container *ngTemplateOutlet=\"tooltipTemplate\"></ng-container>\n }\n\n <ng-template #tooltipTemplate>\n @if (v.tooltip) {\n <span\n [matTooltip]=\"v.tooltip\"\n class=\"tooltip\"\n matTooltipClass=\"tooltip-content\"\n >\n <ng-container *ngTemplateOutlet=\"valueTemplate\"></ng-container>\n </span>\n } @else {\n <span [title]=\"v.value\">\n <ng-container *ngTemplateOutlet=\"valueTemplate\"></ng-container>\n </span>\n }\n </ng-template>\n\n <ng-template #valueTemplate>\n @switch (v.type) {\n @case ('menu') {\n <v-menu-value [value]=\"v\"></v-menu-value>\n }\n @case ('toggle') {\n <v-toggle-value [value]=\"v\"></v-toggle-value>\n }\n @default {\n @let valueText = valueText$ | async;\n @if (inProgress$ | async) {\n <v-content-loading [hiddenText]=\"valueText\"></v-content-loading>\n } @else if (valueText) {\n <span\n [ngClass]=\"{ value__click: v.click, value__link: v.link }\"\n [vHighlightSearch]=\"highlight\"\n [vHighlightText]=\"valueText\"\n vHighlight\n ></span>\n } @else if (v.error) {\n <mat-icon\n [matTooltip]=\"v.error?.['message'] || (v.error | json)\"\n >error</mat-icon\n >\n } @else if (emptySymbol) {\n <span class=\"text-[var(--mat-sys-outline)]\">{{\n emptySymbol\n }}</span>\n }\n }\n }\n </ng-template>\n }\n\n @if (v.description) {\n <div\n [title]=\"v.description\"\n [vHighlightSearch]=\"highlight\"\n [vHighlightText]=\"v.description\"\n class=\"description text-[var(--mat-sys-outline)] text-xs\"\n vHighlight\n ></div>\n }\n </div>\n @if (v.postfix) {\n <button\n class=\"action ml-auto mr-[-16px]\"\n mat-icon-button\n (click)=\"v.postfix.click ? v.postfix.click($event) : undefined\"\n >\n <mat-icon>{{ v.postfix.icon }}</mat-icon>\n </button>\n }\n </div>\n } @else {\n <v-content-loading></v-content-loading>\n }\n}\n", styles: [":host{cursor:default;text-align:left}.action{opacity:.1;transition:opacity .2s ease-in-out}.action:hover{opacity:1}::ng-deep .inline,::ng-deep .inline *{white-space:nowrap}.tooltip{text-decoration:underline;text-decoration-style:dotted}::ng-deep .tooltip-content{white-space:pre-line}.wrapper__action{cursor:pointer}.value__click,.value__link{color:var(--mat-sys-primary)}.value__click:hover{text-decoration:underline;text-decoration-style:dashed}.value__link:hover{text-decoration:underline}.description{overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: TagComponent, selector: "v-tag", inputs: ["color", "icon", "progress"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MenuValueComponent, selector: "v-menu-value", inputs: ["value"] }, { kind: "component", type: ContentLoadingComponent, selector: "v-content-loading", inputs: ["width", "textSize", "hiddenText"] }, { kind: "directive", type: HighlightDirective, selector: "[vHighlight]", inputs: ["vHighlightText", "vHighlightSearch"] }, { kind: "component", type: ToggleValueComponent, selector: "v-toggle-value", inputs: ["value"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.JsonPipe, name: "json" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1484
1499
|
}
|
|
1485
1500
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: ValueComponent, decorators: [{
|
|
1486
1501
|
type: Component,
|
|
@@ -1496,7 +1511,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
1496
1511
|
MatButtonModule,
|
|
1497
1512
|
], host: {
|
|
1498
1513
|
'[class.inline]': 'inline',
|
|
1499
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!value() && lazyValue() && !lazyVisible()) {\n <button class=\"button\" mat-icon-button (click)=\"lazyVisible.set(true)\">\n <mat-icon>sync</mat-icon>\n </button>\n} @else {\n @if (value$ | async; as v) {\n <div class=\"flex gap-1 items-center\">\n @if (v.prefix) {\n <button\n class=\"action ml-[-16px]\"\n mat-icon-button\n (click)=\"v.prefix.click ? v.prefix.click($event) : undefined\"\n >\n <mat-icon>{{ v.prefix.icon }}</mat-icon>\n </button>\n }\n <div\n [ngClass]=\"{ wrapper__action: v.click || v.link }\"\n class=\"wrapper\"\n (click)=\"click($event)\"\n >\n @if (v.template) {\n <ng-container *ngTemplateOutlet=\"v.template; context: {}\"></ng-container>\n } @else {\n @if (v.color) {\n <v-tag [color]=\"v.color\">\n <ng-container *ngTemplateOutlet=\"tooltipTemplate\"></ng-container>\n </v-tag>\n } @else {\n <ng-container *ngTemplateOutlet=\"tooltipTemplate\"></ng-container>\n }\n\n <ng-template #tooltipTemplate>\n @if (v.tooltip) {\n <span\n [matTooltip]=\"v.tooltip\"\n class=\"tooltip\"\n matTooltipClass=\"tooltip-content\"\n >\n <ng-container *ngTemplateOutlet=\"valueTemplate\"></ng-container>\n </span>\n } @else {\n <span [title]=\"v.value\">\n <ng-container *ngTemplateOutlet=\"valueTemplate\"></ng-container>\n </span>\n }\n </ng-template>\n\n <ng-template #valueTemplate>\n @switch (v.type) {\n @case ('menu') {\n <v-menu-value [value]=\"v\"></v-menu-value>\n }\n @case ('toggle') {\n <v-toggle-value [value]=\"v\"></v-toggle-value>\n }\n @default {\n @let valueText = valueText$ | async;\n @if (inProgress$ | async) {\n <v-content-loading [hiddenText]=\"valueText\"></v-content-loading>\n } @else if (valueText) {\n <span\n [ngClass]=\"{ value__click: v.click, value__link: v.link }\"\n [vHighlightSearch]=\"highlight\"\n [vHighlightText]=\"valueText\"\n vHighlight\n ></span>\n } @else if (v.error) {\n <mat-icon
|
|
1514
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!value() && lazyValue() && !lazyVisible()) {\n <button class=\"button\" mat-icon-button (click)=\"lazyVisible.set(true)\">\n <mat-icon>sync</mat-icon>\n </button>\n} @else {\n @if (value$ | async; as v) {\n <div class=\"flex gap-1 items-center\">\n @if (v.prefix) {\n <button\n class=\"action ml-[-16px]\"\n mat-icon-button\n (click)=\"v.prefix.click ? v.prefix.click($event) : undefined\"\n >\n <mat-icon>{{ v.prefix.icon }}</mat-icon>\n </button>\n }\n <div\n [ngClass]=\"{ wrapper__action: v.click || v.link }\"\n class=\"wrapper\"\n (click)=\"click($event)\"\n >\n @if (v.template) {\n <ng-container *ngTemplateOutlet=\"v.template; context: {}\"></ng-container>\n } @else {\n @if (v.color) {\n <v-tag [color]=\"v.color\">\n <ng-container *ngTemplateOutlet=\"tooltipTemplate\"></ng-container>\n </v-tag>\n } @else {\n <ng-container *ngTemplateOutlet=\"tooltipTemplate\"></ng-container>\n }\n\n <ng-template #tooltipTemplate>\n @if (v.tooltip) {\n <span\n [matTooltip]=\"v.tooltip\"\n class=\"tooltip\"\n matTooltipClass=\"tooltip-content\"\n >\n <ng-container *ngTemplateOutlet=\"valueTemplate\"></ng-container>\n </span>\n } @else {\n <span [title]=\"v.value\">\n <ng-container *ngTemplateOutlet=\"valueTemplate\"></ng-container>\n </span>\n }\n </ng-template>\n\n <ng-template #valueTemplate>\n @switch (v.type) {\n @case ('menu') {\n <v-menu-value [value]=\"v\"></v-menu-value>\n }\n @case ('toggle') {\n <v-toggle-value [value]=\"v\"></v-toggle-value>\n }\n @default {\n @let valueText = valueText$ | async;\n @if (inProgress$ | async) {\n <v-content-loading [hiddenText]=\"valueText\"></v-content-loading>\n } @else if (valueText) {\n <span\n [ngClass]=\"{ value__click: v.click, value__link: v.link }\"\n [vHighlightSearch]=\"highlight\"\n [vHighlightText]=\"valueText\"\n vHighlight\n ></span>\n } @else if (v.error) {\n <mat-icon\n [matTooltip]=\"v.error?.['message'] || (v.error | json)\"\n >error</mat-icon\n >\n } @else if (emptySymbol) {\n <span class=\"text-[var(--mat-sys-outline)]\">{{\n emptySymbol\n }}</span>\n }\n }\n }\n </ng-template>\n }\n\n @if (v.description) {\n <div\n [title]=\"v.description\"\n [vHighlightSearch]=\"highlight\"\n [vHighlightText]=\"v.description\"\n class=\"description text-[var(--mat-sys-outline)] text-xs\"\n vHighlight\n ></div>\n }\n </div>\n @if (v.postfix) {\n <button\n class=\"action ml-auto mr-[-16px]\"\n mat-icon-button\n (click)=\"v.postfix.click ? v.postfix.click($event) : undefined\"\n >\n <mat-icon>{{ v.postfix.icon }}</mat-icon>\n </button>\n }\n </div>\n } @else {\n <v-content-loading></v-content-loading>\n }\n}\n", styles: [":host{cursor:default;text-align:left}.action{opacity:.1;transition:opacity .2s ease-in-out}.action:hover{opacity:1}::ng-deep .inline,::ng-deep .inline *{white-space:nowrap}.tooltip{text-decoration:underline;text-decoration-style:dotted}::ng-deep .tooltip-content{white-space:pre-line}.wrapper__action{cursor:pointer}.value__click,.value__link{color:var(--mat-sys-primary)}.value__click:hover{text-decoration:underline;text-decoration-style:dashed}.value__link:hover{text-decoration:underline}.description{overflow:hidden;text-overflow:ellipsis}\n"] }]
|
|
1500
1515
|
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], lazyValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazyValue", required: false }] }], lazyVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazyVisible", required: false }] }, { type: i0.Output, args: ["lazyVisibleChange"] }], progress: [{ type: i0.Input, args: [{ isSignal: true, alias: "progress", required: false }] }], inline: [{
|
|
1501
1516
|
type: Input,
|
|
1502
1517
|
args: [{ transform: booleanAttribute }]
|
|
@@ -2656,8 +2671,10 @@ class TableResourceComponent {
|
|
|
2656
2671
|
}
|
|
2657
2672
|
update(options) {
|
|
2658
2673
|
const res = this.resource();
|
|
2659
|
-
if ('setOptions' in res)
|
|
2674
|
+
if (res && 'setOptions' in res)
|
|
2660
2675
|
res.setOptions(options);
|
|
2676
|
+
else if (res && 'reload' in res)
|
|
2677
|
+
res.reload();
|
|
2661
2678
|
}
|
|
2662
2679
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: TableResourceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2663
2680
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: TableResourceComponent, isStandalone: true, selector: "v-table-resource", inputs: { resource: { classPropertyName: "resource", publicName: "resource", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, externalFilter: { classPropertyName: "externalFilter", publicName: "externalFilter", isSignal: true, isRequired: false, transformFunction: null }, noDownload: { classPropertyName: "noDownload", publicName: "noDownload", isSignal: true, isRequired: false, transformFunction: null }, standaloneFilter: { classPropertyName: "standaloneFilter", publicName: "standaloneFilter", isSignal: true, isRequired: false, transformFunction: null }, tableInputsContent: { classPropertyName: "tableInputsContent", publicName: "tableInputsContent", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filter: "filterChange" }, ngImport: i0, template: `
|
|
@@ -3178,11 +3195,11 @@ class SelectFieldComponent extends FormControlSuperclass {
|
|
|
3178
3195
|
}
|
|
3179
3196
|
}
|
|
3180
3197
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SelectFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3181
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: SelectFieldComponent, isStandalone: false, selector: "v-select-field", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: false, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: false, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: false, isRequired: false, transformFunction: null }, progress: { classPropertyName: "progress", publicName: "progress", isSignal: false, isRequired: false, transformFunction: null }, externalSearch: { classPropertyName: "externalSearch", publicName: "externalSearch", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, required: { classPropertyName: "required", publicName: "required", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, size: { classPropertyName: "size", publicName: "size", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { search: "searchChange" }, providers: createControlProviders(() => SelectFieldComponent), usesInheritance: true, ngImport: i0, template: "<mat-form-field [appearance]=\"appearance\" [ngClass]=\"{ 'v-input-field__small': size === 'small' }\">\n <mat-label>{{ label }}</mat-label>\n\n <mtx-select\n #select\n [closeOnSelect]=\"!multiple\"\n [formControl]=\"control\"\n [items]=\"options\"\n [loading]=\"progress\"\n [markFirst]=\"true\"\n [multiple]=\"multiple\"\n [notFoundText]=\"externalSearch && !search() ? 'Enter your search term' : 'No items found'\"\n [required]=\"required\"\n [searchable]=\"true\"\n [searchFn]=\"searchFn\"\n [selectableGroup]=\"true\"\n [selectableGroupAsModel]=\"false\"\n bindLabel=\"label\"\n bindValue=\"value\"\n groupBy=\"type\"\n (change)=\"close(select)\"\n (clear)=\"search.set('')\"\n (search)=\"search.set($event.term)\"\n >\n <ng-template let-index=\"index\" let-item=\"item\" let-item$=\"item$\" ng-optgroup-tmp>\n @if (multiple) {\n <mat-checkbox\n [ngModel]=\"item$.selected\"\n class=\"checkbox-option\"\n id=\"item-{{ index }}\"\n >\n {{ item.type | uppercase }}\n </mat-checkbox>\n } @else {\n {{ item.type | uppercase }}\n }\n </ng-template>\n <ng-template let-index=\"index\" let-item=\"item\" let-item$=\"item$\" ng-option-tmp>\n @if (multiple) {\n <mat-checkbox\n [ngModel]=\"item$.selected\"\n class=\"checkbox-option\"\n id=\"item-{{ index }}\"\n >\n <ng-container *ngTemplateOutlet=\"text\"></ng-container>\n </mat-checkbox>\n } @else {\n <ng-container *ngTemplateOutlet=\"text\"></ng-container>\n }\n <ng-template #text>\n <div class=\"label\">{{ item.label }}</div>\n @if (item.description) {\n <div class=\"description mat-label-medium text-[var(--mat-sys-outline)]\">\n {{ item.description }}\n </div>\n }\n </ng-template>\n </ng-template>\n </mtx-select>\n\n <mat-hint>{{ hintText }}</mat-hint>\n <mat-error>{{ error }}</mat-error>\n</mat-form-field>\n", styles: ["::ng-deep .mat-mdc-form-field{width:100%}::ng-deep .mat-mdc-form-field>*{max-height:56px}::ng-deep .mat-mdc-form-field .ng-value-container{flex-wrap:nowrap!important;overflow-x:hidden}::ng-deep .ng-dropdown-panel.ng-select-bottom{margin-top:-4px}.checkbox-option{margin:-12px 0 -12px -8px}.label,.description{overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i3$3.MtxSelect, selector: "mtx-select", inputs: ["usePopover", "addTag", "addTagText", "appendTo", "bindLabel", "bindValue", "closeOnSelect", "clearable", "clearAllText", "clearOnBackspace", "compareWith", "panelPosition", "groupBy", "groupValue", "bufferAmount", "selectableGroup", "selectableGroupAsModel", "hideSelected", "loading", "loadingText", "markFirst", "maxSelectedItems", "multiple", "notFoundText", "searchable", "readonly", "searchFn", "searchWhileComposing", "selectOnTab", "trackByFn", "openOnEnter", "minTermLength", "editableSearchTerm", "keyDownFn", "virtualScroll", "typeToSearchText", "typeahead", "panelDisabled", "fixedPlaceholder", "preventToggleOnRightClick", "clearSearchOnAdd", "deselectOnClick", "tabIndex", "inputId", "inputAttrs", "panelClass", "items", "value", "id", "placeholder", "disabled", "required", "errorStateMatcher", "ariaLabel", "ariaLabelledby", "ariaDescribedby"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"], exportAs: ["mtxSelect"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "pipe", type: i1$1.UpperCasePipe, name: "uppercase" }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
3198
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: SelectFieldComponent, isStandalone: false, selector: "v-select-field", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: false, isRequired: false, transformFunction: null }, search: { classPropertyName: "search", publicName: "search", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: false, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: false, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: false, isRequired: false, transformFunction: null }, progress: { classPropertyName: "progress", publicName: "progress", isSignal: false, isRequired: false, transformFunction: null }, externalSearch: { classPropertyName: "externalSearch", publicName: "externalSearch", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, required: { classPropertyName: "required", publicName: "required", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, size: { classPropertyName: "size", publicName: "size", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { search: "searchChange" }, providers: createControlProviders(() => SelectFieldComponent), usesInheritance: true, ngImport: i0, template: "<mat-form-field [appearance]=\"appearance\" [ngClass]=\"{ 'v-input-field__small': size === 'small' }\">\n <mat-label>{{ label }}</mat-label>\n\n <mtx-select\n #select\n [closeOnSelect]=\"!multiple\"\n [formControl]=\"control\"\n [items]=\"\n options?.length || !control?.value\n ? options\n : [{ value: control.value, label: control.value }]\n \"\n [loading]=\"progress\"\n [markFirst]=\"true\"\n [multiple]=\"multiple\"\n [notFoundText]=\"externalSearch && !search() ? 'Enter your search term' : 'No items found'\"\n [required]=\"required\"\n [searchable]=\"true\"\n [searchFn]=\"searchFn\"\n [selectableGroup]=\"true\"\n [selectableGroupAsModel]=\"false\"\n bindLabel=\"label\"\n bindValue=\"value\"\n groupBy=\"type\"\n (change)=\"close(select)\"\n (clear)=\"search.set('')\"\n (search)=\"search.set($event.term)\"\n >\n <ng-template let-index=\"index\" let-item=\"item\" let-item$=\"item$\" ng-optgroup-tmp>\n @if (multiple) {\n <mat-checkbox\n [ngModel]=\"item$.selected\"\n class=\"checkbox-option\"\n id=\"item-{{ index }}\"\n >\n {{ item.type | uppercase }}\n </mat-checkbox>\n } @else {\n {{ item.type | uppercase }}\n }\n </ng-template>\n <ng-template let-index=\"index\" let-item=\"item\" let-item$=\"item$\" ng-option-tmp>\n @if (multiple) {\n <mat-checkbox\n [ngModel]=\"item$.selected\"\n class=\"checkbox-option\"\n id=\"item-{{ index }}\"\n >\n <ng-container *ngTemplateOutlet=\"text\"></ng-container>\n </mat-checkbox>\n } @else {\n <ng-container *ngTemplateOutlet=\"text\"></ng-container>\n }\n <ng-template #text>\n <div class=\"label\">{{ item.label }}</div>\n @if (item.description) {\n <div class=\"description mat-label-medium text-[var(--mat-sys-outline)]\">\n {{ item.description }}\n </div>\n }\n </ng-template>\n </ng-template>\n </mtx-select>\n\n <mat-hint>{{ hintText }}</mat-hint>\n <mat-error>{{ error }}</mat-error>\n</mat-form-field>\n", styles: ["::ng-deep .mat-mdc-form-field{width:100%}::ng-deep .mat-mdc-form-field>*{max-height:56px}::ng-deep .mat-mdc-form-field .ng-value-container{flex-wrap:nowrap!important;overflow-x:hidden}::ng-deep .ng-dropdown-panel.ng-select-bottom{margin-top:-4px}.checkbox-option{margin:-12px 0 -12px -8px}.label,.description{overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i3$3.MtxSelect, selector: "mtx-select", inputs: ["usePopover", "addTag", "addTagText", "appendTo", "bindLabel", "bindValue", "closeOnSelect", "clearable", "clearAllText", "clearOnBackspace", "compareWith", "panelPosition", "groupBy", "groupValue", "bufferAmount", "selectableGroup", "selectableGroupAsModel", "hideSelected", "loading", "loadingText", "markFirst", "maxSelectedItems", "multiple", "notFoundText", "searchable", "readonly", "searchFn", "searchWhileComposing", "selectOnTab", "trackByFn", "openOnEnter", "minTermLength", "editableSearchTerm", "keyDownFn", "virtualScroll", "typeToSearchText", "typeahead", "panelDisabled", "fixedPlaceholder", "preventToggleOnRightClick", "clearSearchOnAdd", "deselectOnClick", "tabIndex", "inputId", "inputAttrs", "panelClass", "items", "value", "id", "placeholder", "disabled", "required", "errorStateMatcher", "ariaLabel", "ariaLabelledby", "ariaDescribedby"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"], exportAs: ["mtxSelect"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "pipe", type: i1$1.UpperCasePipe, name: "uppercase" }], changeDetection: i0.ChangeDetectionStrategy.Eager });
|
|
3182
3199
|
}
|
|
3183
3200
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: SelectFieldComponent, decorators: [{
|
|
3184
3201
|
type: Component,
|
|
3185
|
-
args: [{ selector: 'v-select-field', providers: createControlProviders(() => SelectFieldComponent), changeDetection: ChangeDetectionStrategy.Eager, standalone: false, template: "<mat-form-field [appearance]=\"appearance\" [ngClass]=\"{ 'v-input-field__small': size === 'small' }\">\n <mat-label>{{ label }}</mat-label>\n\n <mtx-select\n #select\n [closeOnSelect]=\"!multiple\"\n [formControl]=\"control\"\n [items]=\"options\"\n [loading]=\"progress\"\n [markFirst]=\"true\"\n [multiple]=\"multiple\"\n [notFoundText]=\"externalSearch && !search() ? 'Enter your search term' : 'No items found'\"\n [required]=\"required\"\n [searchable]=\"true\"\n [searchFn]=\"searchFn\"\n [selectableGroup]=\"true\"\n [selectableGroupAsModel]=\"false\"\n bindLabel=\"label\"\n bindValue=\"value\"\n groupBy=\"type\"\n (change)=\"close(select)\"\n (clear)=\"search.set('')\"\n (search)=\"search.set($event.term)\"\n >\n <ng-template let-index=\"index\" let-item=\"item\" let-item$=\"item$\" ng-optgroup-tmp>\n @if (multiple) {\n <mat-checkbox\n [ngModel]=\"item$.selected\"\n class=\"checkbox-option\"\n id=\"item-{{ index }}\"\n >\n {{ item.type | uppercase }}\n </mat-checkbox>\n } @else {\n {{ item.type | uppercase }}\n }\n </ng-template>\n <ng-template let-index=\"index\" let-item=\"item\" let-item$=\"item$\" ng-option-tmp>\n @if (multiple) {\n <mat-checkbox\n [ngModel]=\"item$.selected\"\n class=\"checkbox-option\"\n id=\"item-{{ index }}\"\n >\n <ng-container *ngTemplateOutlet=\"text\"></ng-container>\n </mat-checkbox>\n } @else {\n <ng-container *ngTemplateOutlet=\"text\"></ng-container>\n }\n <ng-template #text>\n <div class=\"label\">{{ item.label }}</div>\n @if (item.description) {\n <div class=\"description mat-label-medium text-[var(--mat-sys-outline)]\">\n {{ item.description }}\n </div>\n }\n </ng-template>\n </ng-template>\n </mtx-select>\n\n <mat-hint>{{ hintText }}</mat-hint>\n <mat-error>{{ error }}</mat-error>\n</mat-form-field>\n", styles: ["::ng-deep .mat-mdc-form-field{width:100%}::ng-deep .mat-mdc-form-field>*{max-height:56px}::ng-deep .mat-mdc-form-field .ng-value-container{flex-wrap:nowrap!important;overflow-x:hidden}::ng-deep .ng-dropdown-panel.ng-select-bottom{margin-top:-4px}.checkbox-option{margin:-12px 0 -12px -8px}.label,.description{overflow:hidden;text-overflow:ellipsis}\n"] }]
|
|
3202
|
+
args: [{ selector: 'v-select-field', providers: createControlProviders(() => SelectFieldComponent), changeDetection: ChangeDetectionStrategy.Eager, standalone: false, template: "<mat-form-field [appearance]=\"appearance\" [ngClass]=\"{ 'v-input-field__small': size === 'small' }\">\n <mat-label>{{ label }}</mat-label>\n\n <mtx-select\n #select\n [closeOnSelect]=\"!multiple\"\n [formControl]=\"control\"\n [items]=\"\n options?.length || !control?.value\n ? options\n : [{ value: control.value, label: control.value }]\n \"\n [loading]=\"progress\"\n [markFirst]=\"true\"\n [multiple]=\"multiple\"\n [notFoundText]=\"externalSearch && !search() ? 'Enter your search term' : 'No items found'\"\n [required]=\"required\"\n [searchable]=\"true\"\n [searchFn]=\"searchFn\"\n [selectableGroup]=\"true\"\n [selectableGroupAsModel]=\"false\"\n bindLabel=\"label\"\n bindValue=\"value\"\n groupBy=\"type\"\n (change)=\"close(select)\"\n (clear)=\"search.set('')\"\n (search)=\"search.set($event.term)\"\n >\n <ng-template let-index=\"index\" let-item=\"item\" let-item$=\"item$\" ng-optgroup-tmp>\n @if (multiple) {\n <mat-checkbox\n [ngModel]=\"item$.selected\"\n class=\"checkbox-option\"\n id=\"item-{{ index }}\"\n >\n {{ item.type | uppercase }}\n </mat-checkbox>\n } @else {\n {{ item.type | uppercase }}\n }\n </ng-template>\n <ng-template let-index=\"index\" let-item=\"item\" let-item$=\"item$\" ng-option-tmp>\n @if (multiple) {\n <mat-checkbox\n [ngModel]=\"item$.selected\"\n class=\"checkbox-option\"\n id=\"item-{{ index }}\"\n >\n <ng-container *ngTemplateOutlet=\"text\"></ng-container>\n </mat-checkbox>\n } @else {\n <ng-container *ngTemplateOutlet=\"text\"></ng-container>\n }\n <ng-template #text>\n <div class=\"label\">{{ item.label }}</div>\n @if (item.description) {\n <div class=\"description mat-label-medium text-[var(--mat-sys-outline)]\">\n {{ item.description }}\n </div>\n }\n </ng-template>\n </ng-template>\n </mtx-select>\n\n <mat-hint>{{ hintText }}</mat-hint>\n <mat-error>{{ error }}</mat-error>\n</mat-form-field>\n", styles: ["::ng-deep .mat-mdc-form-field{width:100%}::ng-deep .mat-mdc-form-field>*{max-height:56px}::ng-deep .mat-mdc-form-field .ng-value-container{flex-wrap:nowrap!important;overflow-x:hidden}::ng-deep .ng-dropdown-panel.ng-select-bottom{margin-top:-4px}.checkbox-option{margin:-12px 0 -12px -8px}.label,.description{overflow:hidden;text-overflow:ellipsis}\n"] }]
|
|
3186
3203
|
}], propDecorators: { options: [{
|
|
3187
3204
|
type: Input
|
|
3188
3205
|
}], search: [{ type: i0.Input, args: [{ isSignal: true, alias: "search", required: false }] }, { type: i0.Output, args: ["searchChange"] }], appearance: [{
|
|
@@ -4066,7 +4083,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
|
|
|
4066
4083
|
|
|
4067
4084
|
function isActiveLink(link, url) {
|
|
4068
4085
|
return (!isNil$1(url) &&
|
|
4069
|
-
(
|
|
4086
|
+
((Boolean(link.url) && url.startsWith(link.url)) ||
|
|
4087
|
+
(Boolean(link.checkUrl) && url.startsWith(link.checkUrl))));
|
|
4070
4088
|
}
|
|
4071
4089
|
function getActiveLinks(links, url) {
|
|
4072
4090
|
return links.reduce((acc, link) => {
|
|
@@ -4095,11 +4113,11 @@ class NavComponent {
|
|
|
4095
4113
|
.filter((link) => !link.isHidden)))));
|
|
4096
4114
|
}
|
|
4097
4115
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: NavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4098
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: NavComponent, isStandalone: true, selector: "v-nav", inputs: { links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"v-nav gap-3\">\n @let activeLinks = (activeLinks$ | async) || [];\n\n @for (linkGroup of viewedLinks$ | async; track linkGroup; let index = $index) {\n @if (index > 0) {\n <mat-divider></mat-divider>\n }\n <div class=\"flex flex-col\">\n @for (link of linkGroup.children; track link) {\n @let isActive = activeLinks.includes(link);\n\n @if (link.children) {\n <button\n [ngClass]=\"{\n '!text-[var(--mat-sys-on-surface-variant)]': !isActive,\n }\"\n [routerLink]=\"link.url\"\n [title]=\"link.label\"\n class=\"!justify-end mx-2 !px-4 !flex-row-reverse\"\n matButton\n >\n {{ link.label }}\n <mat-icon class=\"pl-2\">{{\n link.children.length\n ? isActive\n ? 'keyboard_arrow_down'\n : 'keyboard_arrow_up'\n : 'keyboard_arrow_right'\n }}</mat-icon>\n </button>\n } @else {\n <button\n [matButton]=\"isActive ? 'tonal' : 'text'\"\n [routerLink]=\"link.url\"\n [title]=\"link.label\"\n class=\"!justify-start mx-2 !px-4 !text-[var(--mat-sys-on-surface-variant)]\"\n >\n {{ link.label }}\n </button>\n }\n @if (isActive && link.children?.length) {\n <div
|
|
4116
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: NavComponent, isStandalone: true, selector: "v-nav", inputs: { links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"v-nav gap-3\">\n @let activeLinks = (activeLinks$ | async) || [];\n\n @for (linkGroup of viewedLinks$ | async; track linkGroup; let index = $index) {\n @if (index > 0) {\n <mat-divider></mat-divider>\n }\n <div class=\"flex flex-col\">\n @for (link of linkGroup.children; track link) {\n @let isActive = activeLinks.includes(link);\n\n @if (link.divider) {\n <mat-divider></mat-divider>\n } @else if (link.children) {\n <button\n [ngClass]=\"{\n '!text-[var(--mat-sys-on-surface-variant)]': !isActive,\n }\"\n [routerLink]=\"link.url\"\n [title]=\"link.label\"\n class=\"!justify-end mx-2 !px-4 !flex-row-reverse\"\n matButton\n >\n {{ link.label }}\n <mat-icon class=\"pl-2\">{{\n link.children.length\n ? isActive\n ? 'keyboard_arrow_down'\n : 'keyboard_arrow_up'\n : 'keyboard_arrow_right'\n }}</mat-icon>\n </button>\n } @else {\n <button\n [matButton]=\"isActive ? 'tonal' : 'text'\"\n [routerLink]=\"link.url\"\n [title]=\"link.label\"\n class=\"!justify-start mx-2 !px-4 !text-[var(--mat-sys-on-surface-variant)]\"\n >\n {{ link.label }}\n </button>\n }\n @if (isActive && link.children?.length) {\n <div\n class=\"flex flex-col border-l-1 border-[var(--mat-sys-outline-variant)] ml-6 mb-2\"\n >\n @for (childLink of link.children; track childLink) {\n @if (childLink.divider) {\n <mat-divider></mat-divider>\n } @else {\n <button\n [matButton]=\"activeLinks.includes(childLink) ? 'tonal' : 'text'\"\n [routerLink]=\"childLink.url\"\n [title]=\"childLink.label\"\n class=\"!justify-start mx-2 !px-4 !text-[var(--mat-sys-on-surface-variant)]\"\n >\n {{ childLink.label }}\n </button>\n }\n }\n </div>\n }\n }\n </div>\n }\n</div>\n", styles: [".v-nav{display:flex;flex-direction:column}.v-nav .item{cursor:pointer;padding:12px 24px 12px 12px}.v-nav .item__active{font-weight:500}.v-nav .item:after{display:block;content:attr(title);font-weight:500;height:0;color:transparent;overflow:hidden;visibility:hidden}.v-nav__secondary .item{border-left:solid 4px}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatDividerModule }, { kind: "component", type: i2.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
|
|
4099
4117
|
}
|
|
4100
4118
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: NavComponent, decorators: [{
|
|
4101
4119
|
type: Component,
|
|
4102
|
-
args: [{ selector: 'v-nav', imports: [RouterLink, MatButtonModule, MatDividerModule, CommonModule, MatIconModule], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<div class=\"v-nav gap-3\">\n @let activeLinks = (activeLinks$ | async) || [];\n\n @for (linkGroup of viewedLinks$ | async; track linkGroup; let index = $index) {\n @if (index > 0) {\n <mat-divider></mat-divider>\n }\n <div class=\"flex flex-col\">\n @for (link of linkGroup.children; track link) {\n @let isActive = activeLinks.includes(link);\n\n @if (link.children) {\n <button\n [ngClass]=\"{\n '!text-[var(--mat-sys-on-surface-variant)]': !isActive,\n }\"\n [routerLink]=\"link.url\"\n [title]=\"link.label\"\n class=\"!justify-end mx-2 !px-4 !flex-row-reverse\"\n matButton\n >\n {{ link.label }}\n <mat-icon class=\"pl-2\">{{\n link.children.length\n ? isActive\n ? 'keyboard_arrow_down'\n : 'keyboard_arrow_up'\n : 'keyboard_arrow_right'\n }}</mat-icon>\n </button>\n } @else {\n <button\n [matButton]=\"isActive ? 'tonal' : 'text'\"\n [routerLink]=\"link.url\"\n [title]=\"link.label\"\n class=\"!justify-start mx-2 !px-4 !text-[var(--mat-sys-on-surface-variant)]\"\n >\n {{ link.label }}\n </button>\n }\n @if (isActive && link.children?.length) {\n <div
|
|
4120
|
+
args: [{ selector: 'v-nav', imports: [RouterLink, MatButtonModule, MatDividerModule, CommonModule, MatIconModule], changeDetection: ChangeDetectionStrategy.Eager, encapsulation: ViewEncapsulation.None, template: "<div class=\"v-nav gap-3\">\n @let activeLinks = (activeLinks$ | async) || [];\n\n @for (linkGroup of viewedLinks$ | async; track linkGroup; let index = $index) {\n @if (index > 0) {\n <mat-divider></mat-divider>\n }\n <div class=\"flex flex-col\">\n @for (link of linkGroup.children; track link) {\n @let isActive = activeLinks.includes(link);\n\n @if (link.divider) {\n <mat-divider></mat-divider>\n } @else if (link.children) {\n <button\n [ngClass]=\"{\n '!text-[var(--mat-sys-on-surface-variant)]': !isActive,\n }\"\n [routerLink]=\"link.url\"\n [title]=\"link.label\"\n class=\"!justify-end mx-2 !px-4 !flex-row-reverse\"\n matButton\n >\n {{ link.label }}\n <mat-icon class=\"pl-2\">{{\n link.children.length\n ? isActive\n ? 'keyboard_arrow_down'\n : 'keyboard_arrow_up'\n : 'keyboard_arrow_right'\n }}</mat-icon>\n </button>\n } @else {\n <button\n [matButton]=\"isActive ? 'tonal' : 'text'\"\n [routerLink]=\"link.url\"\n [title]=\"link.label\"\n class=\"!justify-start mx-2 !px-4 !text-[var(--mat-sys-on-surface-variant)]\"\n >\n {{ link.label }}\n </button>\n }\n @if (isActive && link.children?.length) {\n <div\n class=\"flex flex-col border-l-1 border-[var(--mat-sys-outline-variant)] ml-6 mb-2\"\n >\n @for (childLink of link.children; track childLink) {\n @if (childLink.divider) {\n <mat-divider></mat-divider>\n } @else {\n <button\n [matButton]=\"activeLinks.includes(childLink) ? 'tonal' : 'text'\"\n [routerLink]=\"childLink.url\"\n [title]=\"childLink.label\"\n class=\"!justify-start mx-2 !px-4 !text-[var(--mat-sys-on-surface-variant)]\"\n >\n {{ childLink.label }}\n </button>\n }\n }\n </div>\n }\n }\n </div>\n }\n</div>\n", styles: [".v-nav{display:flex;flex-direction:column}.v-nav .item{cursor:pointer;padding:12px 24px 12px 12px}.v-nav .item__active{font-weight:500}.v-nav .item:after{display:block;content:attr(title);font-weight:500;height:0;color:transparent;overflow:hidden;visibility:hidden}.v-nav__secondary .item{border-left:solid 4px}\n"] }]
|
|
4103
4121
|
}], propDecorators: { links: [{ type: i0.Input, args: [{ isSignal: true, alias: "links", required: false }] }] } });
|
|
4104
4122
|
|
|
4105
4123
|
class CmdkComponent {
|