@arsedizioni/ars-utils 22.5.49 → 22.5.50
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/arsedizioni-ars-utils-clipper.common.mjs +15 -15
- package/fesm2022/arsedizioni-ars-utils-clipper.ui.mjs +42 -42
- package/fesm2022/arsedizioni-ars-utils-core.date.mjs +178 -8
- package/fesm2022/arsedizioni-ars-utils-core.date.mjs.map +1 -1
- package/fesm2022/arsedizioni-ars-utils-core.markdown.mjs +3 -3
- package/fesm2022/arsedizioni-ars-utils-core.mjs +48 -48
- package/fesm2022/arsedizioni-ars-utils-core.validators.mjs +42 -42
- package/fesm2022/arsedizioni-ars-utils-evolution.common.mjs +15 -15
- package/fesm2022/arsedizioni-ars-utils-support.common.mjs +9 -9
- package/fesm2022/arsedizioni-ars-utils-ui.controls.date.mjs +6 -6
- package/fesm2022/arsedizioni-ars-utils-ui.controls.mjs +9 -9
- package/fesm2022/arsedizioni-ars-utils-ui.controls.tree.mjs +3 -3
- package/fesm2022/arsedizioni-ars-utils-ui.dialogs.auth.mjs +18 -18
- package/fesm2022/arsedizioni-ars-utils-ui.dialogs.mjs +12 -12
- package/fesm2022/arsedizioni-ars-utils-ui.dialogs.prompt.mjs +9 -9
- package/fesm2022/arsedizioni-ars-utils-ui.dialogs.select.mjs +15 -15
- package/fesm2022/arsedizioni-ars-utils-ui.files.mjs +12 -12
- package/fesm2022/arsedizioni-ars-utils-ui.filters.mjs +3 -3
- package/fesm2022/arsedizioni-ars-utils-ui.help.mjs +9 -9
- package/fesm2022/arsedizioni-ars-utils-ui.mjs +61 -61
- package/fesm2022/arsedizioni-ars-utils-ui.navigation.mjs +3 -3
- package/fesm2022/arsedizioni-ars-utils-ui.notifications.mjs +6 -6
- package/fesm2022/arsedizioni-ars-utils-ui.oauth.mjs +6 -6
- package/fesm2022/arsedizioni-ars-utils-ui.paginator.mjs +3 -3
- package/fesm2022/arsedizioni-ars-utils-ui.shell.mjs +9 -9
- package/fesm2022/arsedizioni-ars-utils-ui.tinymce.mjs +9 -9
- package/package.json +1 -1
- package/types/arsedizioni-ars-utils-clipper.ui.d.ts +1 -1
- package/types/arsedizioni-ars-utils-core.date.d.ts +58 -1
- package/types/arsedizioni-ars-utils-ui.controls.d.ts +1 -1
- package/types/arsedizioni-ars-utils-ui.navigation.d.ts +1 -1
|
@@ -106,10 +106,10 @@ class CoreService {
|
|
|
106
106
|
setProductModules(productModules) {
|
|
107
107
|
this._productModules = productModules;
|
|
108
108
|
}
|
|
109
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
110
|
-
static { this.ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.
|
|
109
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: CoreService, deps: [], target: i0.ɵɵFactoryTarget.Service }); }
|
|
110
|
+
static { this.ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.5", ngImport: i0, type: CoreService }); }
|
|
111
111
|
}
|
|
112
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
112
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: CoreService, decorators: [{
|
|
113
113
|
type: Service
|
|
114
114
|
}] });
|
|
115
115
|
|
|
@@ -203,10 +203,10 @@ class NotificationsService {
|
|
|
203
203
|
downloadNotificationDocument(documentId) {
|
|
204
204
|
return this.httpClient.get(this.core.serviceUri + '/documents/download/' + documentId, { responseType: 'blob' });
|
|
205
205
|
}
|
|
206
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
207
|
-
static { this.ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.
|
|
206
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: NotificationsService, deps: [], target: i0.ɵɵFactoryTarget.Service }); }
|
|
207
|
+
static { this.ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.5", ngImport: i0, type: NotificationsService }); }
|
|
208
208
|
}
|
|
209
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
209
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: NotificationsService, decorators: [{
|
|
210
210
|
type: Service
|
|
211
211
|
}] });
|
|
212
212
|
|
|
@@ -266,10 +266,10 @@ class SupportService {
|
|
|
266
266
|
this.core.setProducts(products);
|
|
267
267
|
this.core.setProductModules(productModules);
|
|
268
268
|
}
|
|
269
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
270
|
-
static { this.ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.
|
|
269
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: SupportService, deps: [], target: i0.ɵɵFactoryTarget.Service }); }
|
|
270
|
+
static { this.ɵprov = i0.ɵɵngDeclareService({ minVersion: "22.0.0", version: "22.1.5", ngImport: i0, type: SupportService }); }
|
|
271
271
|
}
|
|
272
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
272
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: SupportService, decorators: [{
|
|
273
273
|
type: Service
|
|
274
274
|
}] });
|
|
275
275
|
|
|
@@ -18,10 +18,10 @@ class CalendarEmptyHeader {
|
|
|
18
18
|
.pipe(takeUntilDestroyed(this.destroyRef))
|
|
19
19
|
.subscribe(() => this.changeDetector.markForCheck());
|
|
20
20
|
}
|
|
21
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
22
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.
|
|
21
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: CalendarEmptyHeader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
22
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.5", type: CalendarEmptyHeader, isStandalone: true, selector: "ng-component", ngImport: i0, template: '<div></div>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
23
23
|
}
|
|
24
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
24
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: CalendarEmptyHeader, decorators: [{
|
|
25
25
|
type: Component,
|
|
26
26
|
args: [{
|
|
27
27
|
template: '<div></div>',
|
|
@@ -87,10 +87,10 @@ class MatDatepickerParseErrorFixDirective {
|
|
|
87
87
|
const sibling = this.startDate ? rangeInput._endInput : rangeInput._startInput;
|
|
88
88
|
sibling?._validatorOnChange();
|
|
89
89
|
}
|
|
90
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
91
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
90
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: MatDatepickerParseErrorFixDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
91
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.5", type: MatDatepickerParseErrorFixDirective, isStandalone: true, selector: "input[matDatepicker], input[matStartDate], input[matEndDate]", host: { listeners: { "input": "onInput()" } }, ngImport: i0 }); }
|
|
92
92
|
}
|
|
93
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
93
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: MatDatepickerParseErrorFixDirective, decorators: [{
|
|
94
94
|
type: Directive,
|
|
95
95
|
args: [{
|
|
96
96
|
selector: 'input[matDatepicker], input[matStartDate], input[matEndDate]',
|
|
@@ -193,10 +193,10 @@ class ButtonSelectorComponent {
|
|
|
193
193
|
reset() {
|
|
194
194
|
this.setValue(undefined, true);
|
|
195
195
|
}
|
|
196
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
197
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: ButtonSelectorComponent, isStandalone: true, selector: "button-selector", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null }, borderRadius: { classPropertyName: "borderRadius", publicName: "borderRadius", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelSelected: { classPropertyName: "labelSelected", publicName: "labelSelected", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, autoSelect: { classPropertyName: "autoSelect", publicName: "autoSelect", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changed: "changed", selected: "selected" }, host: { properties: { "id": "id", "attr.aria-describedBy": "describedBy" } }, ngImport: i0, template: "<button mat-stroked-button class=\"menu-selector-button\" [style.border]=\"border() >= 0 ? border() : 'auto'\"\r\n [style.border-radius]=\"borderRadius()\" [style.height]=\"border() <= 0 ? '40px' : 'auto'\"\r\n [style.min-width]=\"width() > 0 ? width()+'px' : (width() === -1 ? '100%' : 'auto')\" [attr.aria-label]=\"label()\"\r\n [matMenuTriggerFor]=\"optionsMenu\">\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill>\r\n <div fxFlex=\"100\" fxFlexAlign=\"center\">\r\n @if(current()) {\r\n <div style=\"text-align: left;\"\r\n [style.min-width]=\"width() > 0 ? width()+'px' : (width() === -1 ? '100%' : 'auto')\">\r\n @if(labelSelected() || label()) {\r\n <div class=\"x-small \">{{labelSelected() ?? label()}}</div>\r\n <div fxHide.xs class=\"small truncated-1\">{{current()?.shortName ?? current()?.name ?? ''}}</div>\r\n <div fxHide.gt-xs class=\"x-small truncated-1\" style=\"max-width: 120px;\">\r\n <div>{{current()?.shortName ?? current()?.name ?? ''}}</div>\r\n </div>\r\n } @else {\r\n <div fxHide.xs class=\"small truncated\">{{current()?.shortName ?? current()?.name ?? ''}}</div>\r\n <div fxHide.gt-xs class=\"x-small truncated\" style=\"max-width: 120px;\">\r\n <div>{{current()?.shortName ?? current()?.name ?? ''}}</div>\r\n </div>\r\n }\r\n </div>\r\n } @else if(labelSelected() || label()) {\r\n <div class=\"truncated\" style=\"text-align: left;\"\r\n [style.min-width]=\"width() > 0 ? width()+'px' : (width() === -1 ? '100%' : 'auto')\">\r\n {{labelSelected() ?? label()}}</div>\r\n }\r\n </div>\r\n <div fxLayoutAlign=\"end\" fxFlexAlign=\"center\">\r\n <mat-icon>arrow_drop_down</mat-icon>\r\n </div>\r\n </div>\r\n</button>\r\n<mat-menu #optionsMenu=\"matMenu\">\r\n @for (o of options(); track $index) {\r\n <button mat-menu-item (click)=\"select(o)\" [disabled]=\"o.disabled\">\r\n {{o.name}}\r\n @if(o.bag) {\r\n ({{o.bag}})\r\n }\r\n </button>\r\n }\r\n</mat-menu>", styles: [".menu-selector-button{padding:0 10px 0 20px!important;border-radius:9999px!important}.menu-selector-button .in-search-bar{height:56px!important;padding:0 20px!important;border-top-left-radius:0!important;border-bottom-left-radius:0!important}::ng-deep .menu-selector-button>.mdc-button__label{width:100%!important}.truncated-1{min-width:0;max-width:100%}@supports (-webkit-line-clamp: 1){.truncated-1{overflow:hidden;text-overflow:ellipsis;white-space:initial;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}}\n"], dependencies: [{ kind: "ngmodule", type: FlexLayoutModule }, { kind: "directive", type: i2.FxLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg] ", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.FxFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg] ", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i2.FxShowHideDirective, selector: " [fxShow], [fxHide], [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl], [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl], [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg], [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl], [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl], [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg] ", inputs: ["fxShow", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "directive", type: i2.FxLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg] ", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.FxLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg] ", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2.FxFlexAlignDirective, selector: " [fxFlexAlign], [fxFlexAlign.xs], [fxFlexAlign.sm], [fxFlexAlign.md], [fxFlexAlign.lg], [fxFlexAlign.xl], [fxFlexAlign.lt-sm], [fxFlexAlign.lt-md], [fxFlexAlign.lt-lg], [fxFlexAlign.lt-xl], [fxFlexAlign.gt-xs], [fxFlexAlign.gt-sm], [fxFlexAlign.gt-md], [fxFlexAlign.gt-lg] ", inputs: ["fxFlexAlign", "fxFlexAlign.xs", "fxFlexAlign.sm", "fxFlexAlign.md", "fxFlexAlign.lg", "fxFlexAlign.xl", "fxFlexAlign.lt-sm", "fxFlexAlign.lt-md", "fxFlexAlign.lt-lg", "fxFlexAlign.lt-xl", "fxFlexAlign.gt-xs", "fxFlexAlign.gt-sm", "fxFlexAlign.gt-md", "fxFlexAlign.gt-lg"] }, { kind: "directive", type: i2.FxFlexFillDirective, selector: " [fxFlexFill], [fxFill], [fxFlexFill.xs], [fxFlexFill.sm], [fxFlexFill.md], [fxFlexFill.lg], [fxFlexFill.xl], [fxFlexFill.lt-sm], [fxFlexFill.lt-md], [fxFlexFill.lt-lg], [fxFlexFill.lt-xl], [fxFlexFill.gt-xs], [fxFlexFill.gt-sm], [fxFlexFill.gt-md], [fxFlexFill.gt-lg] ", inputs: ["fxFlexFill", "fxFill", "fxFlexFill.xs", "fxFlexFill.sm", "fxFlexFill.md", "fxFlexFill.lg", "fxFlexFill.xl", "fxFlexFill.lt-sm", "fxFlexFill.lt-md", "fxFlexFill.lt-lg", "fxFlexFill.lt-xl", "fxFlexFill.gt-xs", "fxFlexFill.gt-sm", "fxFlexFill.gt-md", "fxFlexFill.gt-lg"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.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: MatMenuModule }, { kind: "component", type: i5.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i5.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
196
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: ButtonSelectorComponent, deps: [{ token: i1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
197
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: ButtonSelectorComponent, isStandalone: true, selector: "button-selector", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null }, borderRadius: { classPropertyName: "borderRadius", publicName: "borderRadius", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelSelected: { classPropertyName: "labelSelected", publicName: "labelSelected", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, autoSelect: { classPropertyName: "autoSelect", publicName: "autoSelect", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changed: "changed", selected: "selected" }, host: { properties: { "id": "id", "attr.aria-describedBy": "describedBy" } }, ngImport: i0, template: "<button mat-stroked-button class=\"menu-selector-button\" [style.border]=\"border() >= 0 ? border() : 'auto'\"\r\n [style.border-radius]=\"borderRadius()\" [style.height]=\"border() <= 0 ? '40px' : 'auto'\"\r\n [style.min-width]=\"width() > 0 ? width()+'px' : (width() === -1 ? '100%' : 'auto')\" [attr.aria-label]=\"label()\"\r\n [matMenuTriggerFor]=\"optionsMenu\">\r\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxFill>\r\n <div fxFlex=\"100\" fxFlexAlign=\"center\">\r\n @if(current()) {\r\n <div style=\"text-align: left;\"\r\n [style.min-width]=\"width() > 0 ? width()+'px' : (width() === -1 ? '100%' : 'auto')\">\r\n @if(labelSelected() || label()) {\r\n <div class=\"x-small \">{{labelSelected() ?? label()}}</div>\r\n <div fxHide.xs class=\"small truncated-1\">{{current()?.shortName ?? current()?.name ?? ''}}</div>\r\n <div fxHide.gt-xs class=\"x-small truncated-1\" style=\"max-width: 120px;\">\r\n <div>{{current()?.shortName ?? current()?.name ?? ''}}</div>\r\n </div>\r\n } @else {\r\n <div fxHide.xs class=\"small truncated\">{{current()?.shortName ?? current()?.name ?? ''}}</div>\r\n <div fxHide.gt-xs class=\"x-small truncated\" style=\"max-width: 120px;\">\r\n <div>{{current()?.shortName ?? current()?.name ?? ''}}</div>\r\n </div>\r\n }\r\n </div>\r\n } @else if(labelSelected() || label()) {\r\n <div class=\"truncated\" style=\"text-align: left;\"\r\n [style.min-width]=\"width() > 0 ? width()+'px' : (width() === -1 ? '100%' : 'auto')\">\r\n {{labelSelected() ?? label()}}</div>\r\n }\r\n </div>\r\n <div fxLayoutAlign=\"end\" fxFlexAlign=\"center\">\r\n <mat-icon>arrow_drop_down</mat-icon>\r\n </div>\r\n </div>\r\n</button>\r\n<mat-menu #optionsMenu=\"matMenu\">\r\n @for (o of options(); track $index) {\r\n <button mat-menu-item (click)=\"select(o)\" [disabled]=\"o.disabled\">\r\n {{o.name}}\r\n @if(o.bag) {\r\n ({{o.bag}})\r\n }\r\n </button>\r\n }\r\n</mat-menu>", styles: [".menu-selector-button{padding:0 10px 0 20px!important;border-radius:9999px!important}.menu-selector-button .in-search-bar{height:56px!important;padding:0 20px!important;border-top-left-radius:0!important;border-bottom-left-radius:0!important}::ng-deep .menu-selector-button>.mdc-button__label{width:100%!important}.truncated-1{min-width:0;max-width:100%}@supports (-webkit-line-clamp: 1){.truncated-1{overflow:hidden;text-overflow:ellipsis;white-space:initial;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}}\n"], dependencies: [{ kind: "ngmodule", type: FlexLayoutModule }, { kind: "directive", type: i2.FxLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg] ", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.FxFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg] ", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i2.FxShowHideDirective, selector: " [fxShow], [fxHide], [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl], [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl], [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg], [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl], [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl], [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg] ", inputs: ["fxShow", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "directive", type: i2.FxLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg] ", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.FxLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg] ", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2.FxFlexAlignDirective, selector: " [fxFlexAlign], [fxFlexAlign.xs], [fxFlexAlign.sm], [fxFlexAlign.md], [fxFlexAlign.lg], [fxFlexAlign.xl], [fxFlexAlign.lt-sm], [fxFlexAlign.lt-md], [fxFlexAlign.lt-lg], [fxFlexAlign.lt-xl], [fxFlexAlign.gt-xs], [fxFlexAlign.gt-sm], [fxFlexAlign.gt-md], [fxFlexAlign.gt-lg] ", inputs: ["fxFlexAlign", "fxFlexAlign.xs", "fxFlexAlign.sm", "fxFlexAlign.md", "fxFlexAlign.lg", "fxFlexAlign.xl", "fxFlexAlign.lt-sm", "fxFlexAlign.lt-md", "fxFlexAlign.lt-lg", "fxFlexAlign.lt-xl", "fxFlexAlign.gt-xs", "fxFlexAlign.gt-sm", "fxFlexAlign.gt-md", "fxFlexAlign.gt-lg"] }, { kind: "directive", type: i2.FxFlexFillDirective, selector: " [fxFlexFill], [fxFill], [fxFlexFill.xs], [fxFlexFill.sm], [fxFlexFill.md], [fxFlexFill.lg], [fxFlexFill.xl], [fxFlexFill.lt-sm], [fxFlexFill.lt-md], [fxFlexFill.lt-lg], [fxFlexFill.lt-xl], [fxFlexFill.gt-xs], [fxFlexFill.gt-sm], [fxFlexFill.gt-md], [fxFlexFill.gt-lg] ", inputs: ["fxFlexFill", "fxFill", "fxFlexFill.xs", "fxFlexFill.sm", "fxFlexFill.md", "fxFlexFill.lg", "fxFlexFill.xl", "fxFlexFill.lt-sm", "fxFlexFill.lt-md", "fxFlexFill.lt-lg", "fxFlexFill.lt-xl", "fxFlexFill.gt-xs", "fxFlexFill.gt-sm", "fxFlexFill.gt-md", "fxFlexFill.gt-lg"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.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: MatMenuModule }, { kind: "component", type: i5.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i5.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
198
198
|
}
|
|
199
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
199
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: ButtonSelectorComponent, decorators: [{
|
|
200
200
|
type: Component,
|
|
201
201
|
args: [{ selector: 'button-selector', standalone: true, imports: [FlexLayoutModule, MatIconModule, MatButtonModule,
|
|
202
202
|
MatMenuModule], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
@@ -257,10 +257,10 @@ class ButtonToggleComponent {
|
|
|
257
257
|
const toggled = !this.value();
|
|
258
258
|
this.changed.emit({ value: this.value(), toggled });
|
|
259
259
|
}
|
|
260
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
261
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.
|
|
260
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: ButtonToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
261
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: ButtonToggleComponent, isStandalone: true, selector: "button-toggle", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null }, labelOn: { classPropertyName: "labelOn", publicName: "labelOn", isSignal: true, isRequired: false, transformFunction: null }, labelOff: { classPropertyName: "labelOff", publicName: "labelOff", isSignal: true, isRequired: false, transformFunction: null }, iconOn: { classPropertyName: "iconOn", publicName: "iconOn", isSignal: true, isRequired: false, transformFunction: null }, iconOff: { classPropertyName: "iconOff", publicName: "iconOff", isSignal: true, isRequired: false, transformFunction: null }, cssClass: { classPropertyName: "cssClass", publicName: "cssClass", isSignal: true, isRequired: false, transformFunction: null }, cssClassSmall: { classPropertyName: "cssClassSmall", publicName: "cssClassSmall", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changed: "changed" }, ngImport: i0, template: "<button mat-stroked-button [style.border]=\"border() >= 0 ? border() : 'auto'\"\n [style.height]=\"border() <= 0 ? '40px' : 'auto'\" [style.minWidth.px]=\"width() > 0 ? width() : 'auto'\"\n [style.mxn-width.px]=\"width() > 0 ? width() : 'auto'\" [class]=\"cssClass()\" [attr.aria-label]=\"label()\"\n (click)=\"toggle()\" [class.button-on]=\"value() === true\" [fxClass.xs]=\"cssClassSmall()\">\n <div fxLayout=\"row\" fxLayoutGap=\"8px\" fxLayoutAlign=\"center center\" fxFill>\n @if(icon()) {\n <div fxFlex=\"24px\"><mat-icon style=\"display: block;\">{{icon()}}</mat-icon></div>\n }\n <div [innerHtml]=\"label() | safeHtml\"></div>\n </div>\n</button>", styles: [".button-on{background-color:var(--mat-switch-selected-focus-handle-color)!important;border-color:var(--mat-switch-selected-focus-handle-color)!important;font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: FlexLayoutModule }, { kind: "directive", type: i2.FxLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg] ", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2.FxFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg] ", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i2.FxLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg] ", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i2.FxLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg] ", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2.FxFlexFillDirective, selector: " [fxFlexFill], [fxFill], [fxFlexFill.xs], [fxFlexFill.sm], [fxFlexFill.md], [fxFlexFill.lg], [fxFlexFill.xl], [fxFlexFill.lt-sm], [fxFlexFill.lt-md], [fxFlexFill.lt-lg], [fxFlexFill.lt-xl], [fxFlexFill.gt-xs], [fxFlexFill.gt-sm], [fxFlexFill.gt-md], [fxFlexFill.gt-lg] ", inputs: ["fxFlexFill", "fxFill", "fxFlexFill.xs", "fxFlexFill.sm", "fxFlexFill.md", "fxFlexFill.lg", "fxFlexFill.xl", "fxFlexFill.lt-sm", "fxFlexFill.lt-md", "fxFlexFill.lt-lg", "fxFlexFill.lt-xl", "fxFlexFill.gt-xs", "fxFlexFill.gt-sm", "fxFlexFill.gt-md", "fxFlexFill.gt-lg"] }, { kind: "directive", type: i2.FxClassDirective, selector: " [fxClass], [fxClass.xs], [fxClass.sm], [fxClass.md], [fxClass.lg], [fxClass.xl], [fxClass.lt-sm], [fxClass.lt-md], [fxClass.lt-lg], [fxClass.lt-xl], [fxClass.gt-xs], [fxClass.gt-sm], [fxClass.gt-md], [fxClass.gt-lg] ", inputs: ["fxClass", "fxClass.xs", "fxClass.sm", "fxClass.md", "fxClass.lg", "fxClass.xl", "fxClass.lt-sm", "fxClass.lt-md", "fxClass.lt-lg", "fxClass.lt-xl", "fxClass.gt-xs", "fxClass.gt-sm", "fxClass.gt-md", "fxClass.gt-lg"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.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: "pipe", type: SafeHtmlPipe, name: "safeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
262
262
|
}
|
|
263
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
263
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: ButtonToggleComponent, decorators: [{
|
|
264
264
|
type: Component,
|
|
265
265
|
args: [{ selector: 'button-toggle', standalone: true, imports: [FlexLayoutModule, MatIconModule, MatButtonModule, SafeHtmlPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button mat-stroked-button [style.border]=\"border() >= 0 ? border() : 'auto'\"\n [style.height]=\"border() <= 0 ? '40px' : 'auto'\" [style.minWidth.px]=\"width() > 0 ? width() : 'auto'\"\n [style.mxn-width.px]=\"width() > 0 ? width() : 'auto'\" [class]=\"cssClass()\" [attr.aria-label]=\"label()\"\n (click)=\"toggle()\" [class.button-on]=\"value() === true\" [fxClass.xs]=\"cssClassSmall()\">\n <div fxLayout=\"row\" fxLayoutGap=\"8px\" fxLayoutAlign=\"center center\" fxFill>\n @if(icon()) {\n <div fxFlex=\"24px\"><mat-icon style=\"display: block;\">{{icon()}}</mat-icon></div>\n }\n <div [innerHtml]=\"label() | safeHtml\"></div>\n </div>\n</button>", styles: [".button-on{background-color:var(--mat-switch-selected-focus-handle-color)!important;border-color:var(--mat-switch-selected-focus-handle-color)!important;font-weight:700}\n"] }]
|
|
266
266
|
}], propDecorators: { changed: [{ type: i0.Output, args: ["changed"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], border: [{ type: i0.Input, args: [{ isSignal: true, alias: "border", required: false }] }], labelOn: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelOn", required: false }] }], labelOff: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelOff", required: false }] }], iconOn: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOn", required: false }] }], iconOff: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOff", required: false }] }], cssClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "cssClass", required: false }] }], cssClassSmall: [{ type: i0.Input, args: [{ isSignal: true, alias: "cssClassSmall", required: false }] }] } });
|
|
@@ -577,10 +577,10 @@ class ChipsSelectorComponent {
|
|
|
577
577
|
this.setValue([item], true);
|
|
578
578
|
}
|
|
579
579
|
}
|
|
580
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
581
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.
|
|
580
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: ChipsSelectorComponent, deps: [{ token: i1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
581
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: ChipsSelectorComponent, isStandalone: true, selector: "chips-selector", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, collapsedWidth: { classPropertyName: "collapsedWidth", publicName: "collapsedWidth", isSignal: true, isRequired: false, transformFunction: null }, collapsedDisplayMode: { classPropertyName: "collapsedDisplayMode", publicName: "collapsedDisplayMode", isSignal: true, isRequired: false, transformFunction: null }, collapseAt: { classPropertyName: "collapseAt", publicName: "collapseAt", isSignal: true, isRequired: false, transformFunction: null }, collapseAtContainer: { classPropertyName: "collapseAtContainer", publicName: "collapseAtContainer", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, mustSelect: { classPropertyName: "mustSelect", publicName: "mustSelect", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, stacked: { classPropertyName: "stacked", publicName: "stacked", isSignal: true, isRequired: false, transformFunction: null }, padAt: { classPropertyName: "padAt", publicName: "padAt", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { changed: "changed" }, host: { properties: { "id": "id", "class.floating": "shouldLabelFloat", "attr.aria-describedBy": "describedBy" } }, ngImport: i0, template: "<div [id]=\"containerId\" class=\"chips-selector\">\n @if(containerWidth() > 0) {\n @if(collapsed()) {\n @if(collapsedDisplayMode() === 'dropdown') {\n <mat-form-field [style.min-width]=\"collapsedWidth() > 0 ? collapsedWidth()+'px' : '100%'\" subscriptSizing=\"dynamic\">\n @if(label()) {\n <mat-label>{{label()}}</mat-label>\n }\n <mat-select [formField]=\"selectionForm\" [multiple]=\"multiple()\" (selectionChange)=\"updateValue()\">\n <mat-select-trigger>\n @if (value && (value.length || 0) > 0) {\n {{value[0].shortName ?? value[0].name}}\n }\n @if (value && (value.length || 0) > 1) {\n <span class=\"collapsed-additional-selection\">\n (+{{(value.length || 0) - 1}} {{value.length === 2 ? 'altro' : 'altri'}})\n </span>\n }\n </mat-select-trigger>\n @for (o of options(); track $index) {\n <mat-option [value]=\"o\" [disabled]=\"o.disabled\">\n {{o.name}}\n @if(o.bag) {\n ({{o.bag}})\n }\n </mat-option>\n }\n </mat-select>\n @if (value && (value.length || 0) > 0) {\n <button matSuffix tabindex=\"-1\" mat-icon-button aria-label=\"Pulisci\" (click)=\"clear($event)\">\n <mat-icon>close</mat-icon>\n </button>\n }\n </mat-form-field>\n } @else {\n <button-selector [label]=\"label()\" [options]=\"options()\" [width]=\"collapsedWidth()\" [formField]=\"singleForm\"\n (selected)=\"updateValue()\"></button-selector>\n\n }\n } @else {\n <mat-chip-listbox [class]=\"stacked() ? 'mat-mdc-chip-set-stacked' : ''\" [multiple]=\"multiple()\"\n [formField]=\"selectionForm\" (change)=\"updateValue()\">\n @for (o of options(); track $index; let i = $index) {\n <mat-chip-option [matBadge]=\"o.bag\" [matTooltip]=\"o.disabled === true ? 'Non disponibile' : (o.bagInfo ?? '')\" [selectable]=\"isSelectable(o)\" [value]=\"o\"\n [disabled]=\"o.disabled\" [class.chip-padded]=\"i < padAt()\">{{o.shortName ??\n o.name}}</mat-chip-option>\n }\n </mat-chip-listbox>\n }\n }\n</div>", styles: [".chips-selector{width:100%}.chips-selector .collapsed-additional-selection{opacity:.75;font-size:.75em}.chip-padded{margin-right:10px!important}.mdc-evolution-chip--disabled{pointer-events:auto!important}\n"], dependencies: [{ kind: "ngmodule", type: FlexLayoutModule }, { kind: "directive", type: FormField, selector: "[formField]", inputs: ["formField"], exportAs: ["formField"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i3$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i3$1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i3$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i4$1.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "component", type: i4$1.MatChipOption, selector: "mat-basic-chip-option, [mat-basic-chip-option], mat-chip-option, [mat-chip-option]", inputs: ["selectable", "selected"], outputs: ["selectionChange"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i7.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: ButtonSelectorComponent, selector: "button-selector", inputs: ["disabled", "width", "border", "borderRadius", "label", "labelSelected", "options", "autoSelect"], outputs: ["changed", "selected"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
582
582
|
}
|
|
583
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
583
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: ChipsSelectorComponent, decorators: [{
|
|
584
584
|
type: Component,
|
|
585
585
|
args: [{ selector: 'chips-selector', standalone: true, imports: [FlexLayoutModule, FormField, MatFormFieldModule, MatSelectModule,
|
|
586
586
|
MatChipsModule, MatIconModule, MatButtonModule, MatBadgeModule, MatTooltipModule,
|
|
@@ -343,10 +343,10 @@ class TreePickerComponent {
|
|
|
343
343
|
parent = this._maps().parentMap.get(parent.id);
|
|
344
344
|
}
|
|
345
345
|
}
|
|
346
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
347
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: TreePickerComponent, isStandalone: true, selector: "tree-picker", inputs: { tree: { classPropertyName: "tree", publicName: "tree", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, descriptionEmpty: { classPropertyName: "descriptionEmpty", publicName: "descriptionEmpty", isSignal: true, isRequired: false, transformFunction: null }, maxDepth: { classPropertyName: "maxDepth", publicName: "maxDepth", isSignal: true, isRequired: false, transformFunction: null }, maxDepthOverrides: { classPropertyName: "maxDepthOverrides", publicName: "maxDepthOverrides", isSignal: true, isRequired: false, transformFunction: null }, minDepth: { classPropertyName: "minDepth", publicName: "minDepth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange", selectionCount: "selectionCount", changed: "changed" }, viewQueries: [{ propertyName: "_treeRef", first: true, predicate: (MatTree), descendants: true, isSignal: true }], ngImport: i0, template: "<mat-tab-group class=\"taxonomy-picker-tabs\" style=\"height:100%\">\n <mat-tab style=\"overflow-x: hidden !important; height: 100%\">\n <ng-template mat-tab-label>\n Seleziona\n <mat-icon\n style=\"font-size:16px;height:16px;width:16px;margin-left:4px;vertical-align:middle;color:var(--mat-sys-primary)\"\n [matTooltip]=\"'Nessuna selezione = tutti gli argomenti inclusi;\\r\\nOgni elemento selezionato include sempre tutti i suoi sottoelementi'\"\n matTooltipPosition=\"above\">\n info\n </mat-icon>\n </ng-template>\n <div fxLayout=\"column\" fxFill style=\"overflow: hidden; height: 100%;\">\n <div fxFlex>\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxLayoutAlign=\"start center\" fxFill>\n <div fxFlex fxHide.xs>\n <mat-form-field style=\"width:200px; padding: 8px 0px\" appearance=\"outline\"\n subscriptSizing=\"dynamic\">\n <mat-label>Cerca...</mat-label>\n <input type=\"text\" (keyup)=\"doFilter()\" matInput [formField]=\"filterForm\"\n (keydown.enter)=\"$event.preventDefault(); $event.stopPropagation(); nextFiltered()\"\n (keydown.arrowDown)=\"$event.preventDefault(); $event.stopPropagation(); nextFiltered()\">\n @if (filterText()) {\n <button type=\"button\" type=\"button\" tabindex=\"-1\" matSuffix mat-icon-button\n aria-label=\"Clear\" (click)=\"clearFilter()\">\n <mat-icon>close</mat-icon>\n </button>\n }\n </mat-form-field>\n </div>\n @if (filteredItems().length > 0) {\n <div fxFlex=\"50px\" fxHide.xs fxLayoutAlign=\"end center\">\n <div class=\"small\">{{filterIndex() + 1}} / {{filteredItems().length}}</div>\n </div>\n <div fxFlex=\"48px\" fxHide.xs fxLayoutAlign=\"end center\">\n <button mat-icon-button (click)=\"nextFiltered()\">\n <mat-icon aria-label=\"Vai al prossimo\"\n matTooltip=\"Vai al prossimo\">arrow_downward</mat-icon>\n </button>\n </div>\n }\n <div fxFlex=\"*\" fxLayoutAlign=\"end center\">\n <button mat-icon-button [matTooltip]=\"'Espandi tutto'\" (click)=\"expandAll()\">\n <mat-icon>unfold_more</mat-icon>\n </button>\n <button mat-icon-button [matTooltip]=\"'Comprimi tutto'\" (click)=\"collapseAll()\">\n <mat-icon>unfold_less</mat-icon>\n </button>\n <button mat-icon-button [matTooltip]=\"'Azzera selezione'\" [disabled]=\"!hasSelection()\"\n (click)=\"clearAll()\">\n <mat-icon>deselect</mat-icon>\n </button>\n </div>\n </div>\n </div>\n <div fxFlex=\"*\" style=\"overflow-y: auto;\">\n <mat-tree [dataSource]=\"tree()\" [childrenAccessor]=\"treeChildrenAccessor\" class=\"tree\">\n <!-- Leaf node -->\n <mat-tree-node *matTreeNodeDef=\"let node\" matTreeNodePadding [matTreeNodePaddingIndent]=\"20\"\n class=\"tree-node\" [class.tree-node-filtered]=\"filteredNode()?.id === node.id\"\n [class.tree-node-no-select]=\"!isSelectable(node)\"\n [attr.data-node-id]=\"node.id\">\n <button mat-icon-button disabled style=\"visibility: hidden\"></button>\n @if (isSelectable(node)) {\n <mat-checkbox [checked]=\"isSelected(node)\" [disabled]=\"disabled()\" (change)=\"toggleNode(node)\">\n <span class=\"small\">{{node.name}}</span>\n </mat-checkbox>\n } @else {\n <div class=\"tree-node-label-only\">\n <span class=\"small\">{{node.name}}</span>\n </div>\n }\n </mat-tree-node>\n <!-- Expandable node with children -->\n <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" matTreeNodePadding\n [matTreeNodePaddingIndent]=\"20\" #treeNode=\"matTreeNode\" class=\"tree-node\"\n [class.tree-node-filtered]=\"filteredNode()?.id === node.id\"\n [class.tree-node-no-select]=\"!isSelectable(node)\"\n [attr.data-node-id]=\"node.id\">\n <button mat-icon-button matTreeNodeToggle>\n <mat-icon>{{treeNode.isExpanded ? 'expand_more' : 'chevron_right'}}</mat-icon>\n </button>\n @if (isSelectable(node)) {\n <mat-checkbox [checked]=\"isSelected(node)\" [indeterminate]=\"isIndeterminate(node)\"\n [disabled]=\"disabled()\" (change)=\"toggleNode(node)\">\n <span class=\"small\">{{node.name}}</span>\n </mat-checkbox>\n } @else {\n <div class=\"tree-node-label-only\">\n <span class=\"small\">{{node.name}}</span>\n </div>\n }\n </mat-tree-node>\n </mat-tree>\n </div>\n </div>\n </mat-tab>\n <mat-tab [label]=\"hasSelection() ? 'Selezionati (' + selectedVisibleCount() + ')' : 'Selezionati (tutti)'\"\n style=\"height: 100%;\">\n <div fxLayout=\"column\" fxFill style=\"overflow: hidden; height: 100%;\">\n <div fxFlex>\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutGap=\"8px\" style=\"padding:12px\">\n @if (!hasSelection()) {\n <mat-icon>info</mat-icon>\n <span [innerHTML]=\"descriptionEmpty() | safeHtml\"></span>\n } @else {\n <div fxFlex=\"*\" fxLayoutAlign=\"end\">\n <button mat-button color=\"warn\" style=\"margin-left:auto\" (click)=\"clearAll()\">\n <mat-icon>deselect</mat-icon> Azzera tutto\n </button>\n </div>\n }\n </div>\n </div>\n <div fxFlex=\"*\" style=\"overflow-y: auto; padding-bottom: 12px;\">\n <mat-chip-set>\n @for (id of selection(); track id) {\n @let node = nodeById(id);\n @if (node && isChipVisible(id)) {\n <mat-chip (removed)=\"removeNode(node)\" style=\"max-width: 280px;\" [matTooltip]=\"node.name\">\n {{node.name}}\n @if (!disabled()) {\n <button matChipRemove matTooltip=\"Elimina\"><mat-icon>cancel</mat-icon></button>\n }\n </mat-chip>\n }\n }\n </mat-chip-set>\n </div>\n </div>\n </mat-tab>\n</mat-tab-group>", styles: [".tree-picker-tabs ::ng-deep .mat-mdc-tab-body-wrapper{flex:1 1 auto;height:100%}.tree{padding:8px 0 16px;background-color:transparent!important}.tree-node{min-height:36px!important;padding-right:12px;margin-right:0}.tree-node .small-icon-button{width:2rem!important;height:2rem!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center}.tree-node .small-icon-button .mat-mdc-button-touch-target{width:2rem!important;height:2rem!important}.tree-node:not(.tree-node-no-select):hover{cursor:pointer;background-color:var(--mat-menu-item-hover-state-layer-color, transparent);border-radius:24px}.tree-node-filtered ::ng-deep .mdc-label,.tree-node-filtered ::ng-deep .mat-mdc-checkbox label{font-weight:700;color:var(--ars-color-accent, #7894ae)!important}.tree-node-filtered .tree-node-label-only{font-weight:700;color:var(--ars-color-accent, #7894ae);opacity:1}.tree-node-activated ::ng-deep .mdc-label,.tree-node-activated ::ng-deep .mat-mdc-checkbox label{font-weight:700;color:var(--ars-color-secondary, #4a635f)!important}.tree-node-label-only{display:flex;flex-direction:column;justify-content:center;padding-left:30px;opacity:.7}\n"], dependencies: [{ kind: "ngmodule", type: MatTreeModule }, { kind: "directive", type: i1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i1.MatTreeNodePadding, selector: "[matTreeNodePadding]", inputs: ["matTreeNodePadding", "matTreeNodePaddingIndent"] }, { kind: "directive", type: i1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i1.MatTreeNode, selector: "mat-tree-node", inputs: ["tabIndex", "disabled"], outputs: ["activation", "expandedChange"], exportAs: ["matTreeNode"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2.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: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i4.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i4.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i4.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i5.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "directive", type: i5.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i5.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i9.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: FormField, selector: "[formField]", inputs: ["formField"], exportAs: ["formField"] }, { kind: "ngmodule", type: FlexLayoutModule }, { kind: "directive", type: i10.FxLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg] ", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i10.FxFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg] ", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i10.FxShowHideDirective, selector: " [fxShow], [fxHide], [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl], [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl], [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg], [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl], [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl], [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg] ", inputs: ["fxShow", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "directive", type: i10.FxLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg] ", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i10.FxLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg] ", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i10.FxFlexFillDirective, selector: " [fxFlexFill], [fxFill], [fxFlexFill.xs], [fxFlexFill.sm], [fxFlexFill.md], [fxFlexFill.lg], [fxFlexFill.xl], [fxFlexFill.lt-sm], [fxFlexFill.lt-md], [fxFlexFill.lt-lg], [fxFlexFill.lt-xl], [fxFlexFill.gt-xs], [fxFlexFill.gt-sm], [fxFlexFill.gt-md], [fxFlexFill.gt-lg] ", inputs: ["fxFlexFill", "fxFill", "fxFlexFill.xs", "fxFlexFill.sm", "fxFlexFill.md", "fxFlexFill.lg", "fxFlexFill.xl", "fxFlexFill.lt-sm", "fxFlexFill.lt-md", "fxFlexFill.lt-lg", "fxFlexFill.lt-xl", "fxFlexFill.gt-xs", "fxFlexFill.gt-sm", "fxFlexFill.gt-md", "fxFlexFill.gt-lg"] }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
346
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: TreePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
347
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: TreePickerComponent, isStandalone: true, selector: "tree-picker", inputs: { tree: { classPropertyName: "tree", publicName: "tree", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, descriptionEmpty: { classPropertyName: "descriptionEmpty", publicName: "descriptionEmpty", isSignal: true, isRequired: false, transformFunction: null }, maxDepth: { classPropertyName: "maxDepth", publicName: "maxDepth", isSignal: true, isRequired: false, transformFunction: null }, maxDepthOverrides: { classPropertyName: "maxDepthOverrides", publicName: "maxDepthOverrides", isSignal: true, isRequired: false, transformFunction: null }, minDepth: { classPropertyName: "minDepth", publicName: "minDepth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange", selectionCount: "selectionCount", changed: "changed" }, viewQueries: [{ propertyName: "_treeRef", first: true, predicate: (MatTree), descendants: true, isSignal: true }], ngImport: i0, template: "<mat-tab-group class=\"taxonomy-picker-tabs\" style=\"height:100%\">\n <mat-tab style=\"overflow-x: hidden !important; height: 100%\">\n <ng-template mat-tab-label>\n Seleziona\n <mat-icon\n style=\"font-size:16px;height:16px;width:16px;margin-left:4px;vertical-align:middle;color:var(--mat-sys-primary)\"\n [matTooltip]=\"'Nessuna selezione = tutti gli argomenti inclusi;\\r\\nOgni elemento selezionato include sempre tutti i suoi sottoelementi'\"\n matTooltipPosition=\"above\">\n info\n </mat-icon>\n </ng-template>\n <div fxLayout=\"column\" fxFill style=\"overflow: hidden; height: 100%;\">\n <div fxFlex>\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxLayoutAlign=\"start center\" fxFill>\n <div fxFlex fxHide.xs>\n <mat-form-field style=\"width:200px; padding: 8px 0px\" appearance=\"outline\"\n subscriptSizing=\"dynamic\">\n <mat-label>Cerca...</mat-label>\n <input type=\"text\" (keyup)=\"doFilter()\" matInput [formField]=\"filterForm\"\n (keydown.enter)=\"$event.preventDefault(); $event.stopPropagation(); nextFiltered()\"\n (keydown.arrowDown)=\"$event.preventDefault(); $event.stopPropagation(); nextFiltered()\">\n @if (filterText()) {\n <button type=\"button\" type=\"button\" tabindex=\"-1\" matSuffix mat-icon-button\n aria-label=\"Clear\" (click)=\"clearFilter()\">\n <mat-icon>close</mat-icon>\n </button>\n }\n </mat-form-field>\n </div>\n @if (filteredItems().length > 0) {\n <div fxFlex=\"50px\" fxHide.xs fxLayoutAlign=\"end center\">\n <div class=\"small\">{{filterIndex() + 1}} / {{filteredItems().length}}</div>\n </div>\n <div fxFlex=\"48px\" fxHide.xs fxLayoutAlign=\"end center\">\n <button mat-icon-button (click)=\"nextFiltered()\">\n <mat-icon aria-label=\"Vai al prossimo\"\n matTooltip=\"Vai al prossimo\">arrow_downward</mat-icon>\n </button>\n </div>\n }\n <div fxFlex=\"*\" fxLayoutAlign=\"end center\">\n <button mat-icon-button [matTooltip]=\"'Espandi tutto'\" (click)=\"expandAll()\">\n <mat-icon>unfold_more</mat-icon>\n </button>\n <button mat-icon-button [matTooltip]=\"'Comprimi tutto'\" (click)=\"collapseAll()\">\n <mat-icon>unfold_less</mat-icon>\n </button>\n <button mat-icon-button [matTooltip]=\"'Azzera selezione'\" [disabled]=\"!hasSelection()\"\n (click)=\"clearAll()\">\n <mat-icon>deselect</mat-icon>\n </button>\n </div>\n </div>\n </div>\n <div fxFlex=\"*\" style=\"overflow-y: auto;\">\n <mat-tree [dataSource]=\"tree()\" [childrenAccessor]=\"treeChildrenAccessor\" class=\"tree\">\n <!-- Leaf node -->\n <mat-tree-node *matTreeNodeDef=\"let node\" matTreeNodePadding [matTreeNodePaddingIndent]=\"20\"\n class=\"tree-node\" [class.tree-node-filtered]=\"filteredNode()?.id === node.id\"\n [class.tree-node-no-select]=\"!isSelectable(node)\"\n [attr.data-node-id]=\"node.id\">\n <button mat-icon-button disabled style=\"visibility: hidden\"></button>\n @if (isSelectable(node)) {\n <mat-checkbox [checked]=\"isSelected(node)\" [disabled]=\"disabled()\" (change)=\"toggleNode(node)\">\n <span class=\"small\">{{node.name}}</span>\n </mat-checkbox>\n } @else {\n <div class=\"tree-node-label-only\">\n <span class=\"small\">{{node.name}}</span>\n </div>\n }\n </mat-tree-node>\n <!-- Expandable node with children -->\n <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" matTreeNodePadding\n [matTreeNodePaddingIndent]=\"20\" #treeNode=\"matTreeNode\" class=\"tree-node\"\n [class.tree-node-filtered]=\"filteredNode()?.id === node.id\"\n [class.tree-node-no-select]=\"!isSelectable(node)\"\n [attr.data-node-id]=\"node.id\">\n <button mat-icon-button matTreeNodeToggle>\n <mat-icon>{{treeNode.isExpanded ? 'expand_more' : 'chevron_right'}}</mat-icon>\n </button>\n @if (isSelectable(node)) {\n <mat-checkbox [checked]=\"isSelected(node)\" [indeterminate]=\"isIndeterminate(node)\"\n [disabled]=\"disabled()\" (change)=\"toggleNode(node)\">\n <span class=\"small\">{{node.name}}</span>\n </mat-checkbox>\n } @else {\n <div class=\"tree-node-label-only\">\n <span class=\"small\">{{node.name}}</span>\n </div>\n }\n </mat-tree-node>\n </mat-tree>\n </div>\n </div>\n </mat-tab>\n <mat-tab [label]=\"hasSelection() ? 'Selezionati (' + selectedVisibleCount() + ')' : 'Selezionati (tutti)'\"\n style=\"height: 100%;\">\n <div fxLayout=\"column\" fxFill style=\"overflow: hidden; height: 100%;\">\n <div fxFlex>\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutGap=\"8px\" style=\"padding:12px\">\n @if (!hasSelection()) {\n <mat-icon>info</mat-icon>\n <span [innerHTML]=\"descriptionEmpty() | safeHtml\"></span>\n } @else {\n <div fxFlex=\"*\" fxLayoutAlign=\"end\">\n <button mat-button color=\"warn\" style=\"margin-left:auto\" (click)=\"clearAll()\">\n <mat-icon>deselect</mat-icon> Azzera tutto\n </button>\n </div>\n }\n </div>\n </div>\n <div fxFlex=\"*\" style=\"overflow-y: auto; padding-bottom: 12px;\">\n <mat-chip-set>\n @for (id of selection(); track id) {\n @let node = nodeById(id);\n @if (node && isChipVisible(id)) {\n <mat-chip (removed)=\"removeNode(node)\" style=\"max-width: 280px;\" [matTooltip]=\"node.name\">\n {{node.name}}\n @if (!disabled()) {\n <button matChipRemove matTooltip=\"Elimina\"><mat-icon>cancel</mat-icon></button>\n }\n </mat-chip>\n }\n }\n </mat-chip-set>\n </div>\n </div>\n </mat-tab>\n</mat-tab-group>", styles: [".tree-picker-tabs ::ng-deep .mat-mdc-tab-body-wrapper{flex:1 1 auto;height:100%}.tree{padding:8px 0 16px;background-color:transparent!important}.tree-node{min-height:36px!important;padding-right:12px;margin-right:0}.tree-node .small-icon-button{width:2rem!important;height:2rem!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center}.tree-node .small-icon-button .mat-mdc-button-touch-target{width:2rem!important;height:2rem!important}.tree-node:not(.tree-node-no-select):hover{cursor:pointer;background-color:var(--mat-menu-item-hover-state-layer-color, transparent);border-radius:24px}.tree-node-filtered ::ng-deep .mdc-label,.tree-node-filtered ::ng-deep .mat-mdc-checkbox label{font-weight:700;color:var(--ars-color-accent, #7894ae)!important}.tree-node-filtered .tree-node-label-only{font-weight:700;color:var(--ars-color-accent, #7894ae);opacity:1}.tree-node-activated ::ng-deep .mdc-label,.tree-node-activated ::ng-deep .mat-mdc-checkbox label{font-weight:700;color:var(--ars-color-secondary, #4a635f)!important}.tree-node-label-only{display:flex;flex-direction:column;justify-content:center;padding-left:30px;opacity:.7}\n"], dependencies: [{ kind: "ngmodule", type: MatTreeModule }, { kind: "directive", type: i1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i1.MatTreeNodePadding, selector: "[matTreeNodePadding]", inputs: ["matTreeNodePadding", "matTreeNodePaddingIndent"] }, { kind: "directive", type: i1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i1.MatTreeNode, selector: "mat-tree-node", inputs: ["tabIndex", "disabled"], outputs: ["activation", "expandedChange"], exportAs: ["matTreeNode"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2.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: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i4.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i4.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass", "id"], exportAs: ["matTab"] }, { kind: "component", type: i4.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "mat-align-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i5.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "directive", type: i5.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i5.MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i9.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: FormField, selector: "[formField]", inputs: ["formField"], exportAs: ["formField"] }, { kind: "ngmodule", type: FlexLayoutModule }, { kind: "directive", type: i10.FxLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg] ", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i10.FxFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg] ", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i10.FxShowHideDirective, selector: " [fxShow], [fxHide], [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl], [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl], [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg], [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl], [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl], [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg] ", inputs: ["fxShow", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "directive", type: i10.FxLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg] ", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i10.FxLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg] ", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i10.FxFlexFillDirective, selector: " [fxFlexFill], [fxFill], [fxFlexFill.xs], [fxFlexFill.sm], [fxFlexFill.md], [fxFlexFill.lg], [fxFlexFill.xl], [fxFlexFill.lt-sm], [fxFlexFill.lt-md], [fxFlexFill.lt-lg], [fxFlexFill.lt-xl], [fxFlexFill.gt-xs], [fxFlexFill.gt-sm], [fxFlexFill.gt-md], [fxFlexFill.gt-lg] ", inputs: ["fxFlexFill", "fxFill", "fxFlexFill.xs", "fxFlexFill.sm", "fxFlexFill.md", "fxFlexFill.lg", "fxFlexFill.xl", "fxFlexFill.lt-sm", "fxFlexFill.lt-md", "fxFlexFill.lt-lg", "fxFlexFill.lt-xl", "fxFlexFill.gt-xs", "fxFlexFill.gt-sm", "fxFlexFill.gt-md", "fxFlexFill.gt-lg"] }, { kind: "pipe", type: SafeHtmlPipe, name: "safeHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
348
348
|
}
|
|
349
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
349
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: TreePickerComponent, decorators: [{
|
|
350
350
|
type: Component,
|
|
351
351
|
args: [{ selector: 'tree-picker', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatTreeModule, MatCheckboxModule, MatIconModule, MatTabsModule, MatChipsModule,
|
|
352
352
|
MatButtonModule, MatTooltipModule, MatFormFieldModule, MatInputModule, FormField, FlexLayoutModule, SafeHtmlPipe], template: "<mat-tab-group class=\"taxonomy-picker-tabs\" style=\"height:100%\">\n <mat-tab style=\"overflow-x: hidden !important; height: 100%\">\n <ng-template mat-tab-label>\n Seleziona\n <mat-icon\n style=\"font-size:16px;height:16px;width:16px;margin-left:4px;vertical-align:middle;color:var(--mat-sys-primary)\"\n [matTooltip]=\"'Nessuna selezione = tutti gli argomenti inclusi;\\r\\nOgni elemento selezionato include sempre tutti i suoi sottoelementi'\"\n matTooltipPosition=\"above\">\n info\n </mat-icon>\n </ng-template>\n <div fxLayout=\"column\" fxFill style=\"overflow: hidden; height: 100%;\">\n <div fxFlex>\n <div fxLayout=\"row\" fxLayoutGap=\"10px\" fxLayoutAlign=\"start center\" fxFill>\n <div fxFlex fxHide.xs>\n <mat-form-field style=\"width:200px; padding: 8px 0px\" appearance=\"outline\"\n subscriptSizing=\"dynamic\">\n <mat-label>Cerca...</mat-label>\n <input type=\"text\" (keyup)=\"doFilter()\" matInput [formField]=\"filterForm\"\n (keydown.enter)=\"$event.preventDefault(); $event.stopPropagation(); nextFiltered()\"\n (keydown.arrowDown)=\"$event.preventDefault(); $event.stopPropagation(); nextFiltered()\">\n @if (filterText()) {\n <button type=\"button\" type=\"button\" tabindex=\"-1\" matSuffix mat-icon-button\n aria-label=\"Clear\" (click)=\"clearFilter()\">\n <mat-icon>close</mat-icon>\n </button>\n }\n </mat-form-field>\n </div>\n @if (filteredItems().length > 0) {\n <div fxFlex=\"50px\" fxHide.xs fxLayoutAlign=\"end center\">\n <div class=\"small\">{{filterIndex() + 1}} / {{filteredItems().length}}</div>\n </div>\n <div fxFlex=\"48px\" fxHide.xs fxLayoutAlign=\"end center\">\n <button mat-icon-button (click)=\"nextFiltered()\">\n <mat-icon aria-label=\"Vai al prossimo\"\n matTooltip=\"Vai al prossimo\">arrow_downward</mat-icon>\n </button>\n </div>\n }\n <div fxFlex=\"*\" fxLayoutAlign=\"end center\">\n <button mat-icon-button [matTooltip]=\"'Espandi tutto'\" (click)=\"expandAll()\">\n <mat-icon>unfold_more</mat-icon>\n </button>\n <button mat-icon-button [matTooltip]=\"'Comprimi tutto'\" (click)=\"collapseAll()\">\n <mat-icon>unfold_less</mat-icon>\n </button>\n <button mat-icon-button [matTooltip]=\"'Azzera selezione'\" [disabled]=\"!hasSelection()\"\n (click)=\"clearAll()\">\n <mat-icon>deselect</mat-icon>\n </button>\n </div>\n </div>\n </div>\n <div fxFlex=\"*\" style=\"overflow-y: auto;\">\n <mat-tree [dataSource]=\"tree()\" [childrenAccessor]=\"treeChildrenAccessor\" class=\"tree\">\n <!-- Leaf node -->\n <mat-tree-node *matTreeNodeDef=\"let node\" matTreeNodePadding [matTreeNodePaddingIndent]=\"20\"\n class=\"tree-node\" [class.tree-node-filtered]=\"filteredNode()?.id === node.id\"\n [class.tree-node-no-select]=\"!isSelectable(node)\"\n [attr.data-node-id]=\"node.id\">\n <button mat-icon-button disabled style=\"visibility: hidden\"></button>\n @if (isSelectable(node)) {\n <mat-checkbox [checked]=\"isSelected(node)\" [disabled]=\"disabled()\" (change)=\"toggleNode(node)\">\n <span class=\"small\">{{node.name}}</span>\n </mat-checkbox>\n } @else {\n <div class=\"tree-node-label-only\">\n <span class=\"small\">{{node.name}}</span>\n </div>\n }\n </mat-tree-node>\n <!-- Expandable node with children -->\n <mat-tree-node *matTreeNodeDef=\"let node; when: hasChild\" matTreeNodePadding\n [matTreeNodePaddingIndent]=\"20\" #treeNode=\"matTreeNode\" class=\"tree-node\"\n [class.tree-node-filtered]=\"filteredNode()?.id === node.id\"\n [class.tree-node-no-select]=\"!isSelectable(node)\"\n [attr.data-node-id]=\"node.id\">\n <button mat-icon-button matTreeNodeToggle>\n <mat-icon>{{treeNode.isExpanded ? 'expand_more' : 'chevron_right'}}</mat-icon>\n </button>\n @if (isSelectable(node)) {\n <mat-checkbox [checked]=\"isSelected(node)\" [indeterminate]=\"isIndeterminate(node)\"\n [disabled]=\"disabled()\" (change)=\"toggleNode(node)\">\n <span class=\"small\">{{node.name}}</span>\n </mat-checkbox>\n } @else {\n <div class=\"tree-node-label-only\">\n <span class=\"small\">{{node.name}}</span>\n </div>\n }\n </mat-tree-node>\n </mat-tree>\n </div>\n </div>\n </mat-tab>\n <mat-tab [label]=\"hasSelection() ? 'Selezionati (' + selectedVisibleCount() + ')' : 'Selezionati (tutti)'\"\n style=\"height: 100%;\">\n <div fxLayout=\"column\" fxFill style=\"overflow: hidden; height: 100%;\">\n <div fxFlex>\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutGap=\"8px\" style=\"padding:12px\">\n @if (!hasSelection()) {\n <mat-icon>info</mat-icon>\n <span [innerHTML]=\"descriptionEmpty() | safeHtml\"></span>\n } @else {\n <div fxFlex=\"*\" fxLayoutAlign=\"end\">\n <button mat-button color=\"warn\" style=\"margin-left:auto\" (click)=\"clearAll()\">\n <mat-icon>deselect</mat-icon> Azzera tutto\n </button>\n </div>\n }\n </div>\n </div>\n <div fxFlex=\"*\" style=\"overflow-y: auto; padding-bottom: 12px;\">\n <mat-chip-set>\n @for (id of selection(); track id) {\n @let node = nodeById(id);\n @if (node && isChipVisible(id)) {\n <mat-chip (removed)=\"removeNode(node)\" style=\"max-width: 280px;\" [matTooltip]=\"node.name\">\n {{node.name}}\n @if (!disabled()) {\n <button matChipRemove matTooltip=\"Elimina\"><mat-icon>cancel</mat-icon></button>\n }\n </mat-chip>\n }\n }\n </mat-chip-set>\n </div>\n </div>\n </mat-tab>\n</mat-tab-group>", styles: [".tree-picker-tabs ::ng-deep .mat-mdc-tab-body-wrapper{flex:1 1 auto;height:100%}.tree{padding:8px 0 16px;background-color:transparent!important}.tree-node{min-height:36px!important;padding-right:12px;margin-right:0}.tree-node .small-icon-button{width:2rem!important;height:2rem!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center}.tree-node .small-icon-button .mat-mdc-button-touch-target{width:2rem!important;height:2rem!important}.tree-node:not(.tree-node-no-select):hover{cursor:pointer;background-color:var(--mat-menu-item-hover-state-layer-color, transparent);border-radius:24px}.tree-node-filtered ::ng-deep .mdc-label,.tree-node-filtered ::ng-deep .mat-mdc-checkbox label{font-weight:700;color:var(--ars-color-accent, #7894ae)!important}.tree-node-filtered .tree-node-label-only{font-weight:700;color:var(--ars-color-accent, #7894ae);opacity:1}.tree-node-activated ::ng-deep .mdc-label,.tree-node-activated ::ng-deep .mat-mdc-checkbox label{font-weight:700;color:var(--ars-color-secondary, #4a635f)!important}.tree-node-label-only{display:flex;flex-direction:column;justify-content:center;padding-left:30px;opacity:.7}\n"] }]
|