@ng-matero/extensions 16.3.2 → 17.1.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.
- package/_index.scss +26 -13
- package/alert/_alert-theme.scss +54 -24
- package/alert/alert-module.d.ts +3 -3
- package/alert/alert.d.ts +4 -7
- package/alert/alert.scss +3 -3
- package/button/_button-theme.scss +6 -4
- package/button/button-loading.d.ts +5 -10
- package/button/button-module.d.ts +5 -5
- package/checkbox-group/checkbox-group-module.d.ts +6 -6
- package/checkbox-group/checkbox-group.d.ts +5 -10
- package/colorpicker/_colorpicker-theme.scss +62 -34
- package/colorpicker/colorpicker-input.d.ts +2 -4
- package/colorpicker/colorpicker-module.d.ts +10 -10
- package/colorpicker/colorpicker-toggle.d.ts +4 -5
- package/colorpicker/colorpicker.d.ts +8 -9
- package/column-resize/column-resize-directives/column-resize-flex.d.ts +1 -1
- package/column-resize/column-resize-directives/column-resize.d.ts +1 -1
- package/column-resize/column-resize-module.d.ts +1 -1
- package/core/color/_all-color.scss +7 -18
- package/core/datetime/datetime.module.d.ts +4 -1
- package/core/density/_all-density.scss +17 -25
- package/core/pipes/is-template-ref.pipe.d.ts +1 -1
- package/core/pipes/pipes.module.d.ts +4 -4
- package/core/pipes/to-observable.pipe.d.ts +1 -1
- package/core/style/_sass-utils.scss +13 -1
- package/core/theming/_all-theme.scss +32 -17
- package/core/tokens/_token-utils.scss +4 -5
- package/core/tokens/m2/mdc/_plain-tooltip.scss +21 -29
- package/core/tokens/m2/mtx/_alert.scss +14 -15
- package/core/tokens/m2/mtx/_colorpicker.scss +8 -11
- package/core/tokens/m2/mtx/_datetimepicker.scss +38 -47
- package/core/tokens/m2/mtx/_drawer.scss +9 -10
- package/core/tokens/m2/mtx/_grid.scss +23 -22
- package/core/tokens/m2/mtx/_loader.scss +6 -6
- package/core/tokens/m2/mtx/_popover.scss +10 -11
- package/core/tokens/m2/mtx/_progress.scss +18 -17
- package/core/tokens/m2/mtx/_select.scss +23 -24
- package/core/tokens/m2/mtx/_split.scss +8 -11
- package/core/typography/_all-typography.scss +40 -0
- package/core/typography/_typography.scss +1 -579
- package/datetimepicker/_datetimepicker-theme.scss +75 -48
- package/datetimepicker/calendar-body.d.ts +1 -1
- package/datetimepicker/calendar.d.ts +8 -15
- package/datetimepicker/calendar.scss +16 -4
- package/datetimepicker/clock.d.ts +2 -3
- package/datetimepicker/datetimepicker-content.scss +3 -3
- package/datetimepicker/datetimepicker-input.d.ts +2 -3
- package/datetimepicker/datetimepicker-module.d.ts +16 -16
- package/datetimepicker/datetimepicker-toggle.d.ts +4 -5
- package/datetimepicker/datetimepicker.d.ts +16 -27
- package/datetimepicker/month-view.d.ts +2 -2
- package/datetimepicker/multi-year-view.d.ts +2 -2
- package/datetimepicker/time.d.ts +6 -8
- package/datetimepicker/time.scss +2 -2
- package/datetimepicker/year-view.d.ts +2 -2
- package/dialog/dialog-container.d.ts +1 -1
- package/dialog/dialog-module.d.ts +7 -7
- package/drawer/_drawer-theme.scss +55 -22
- package/drawer/drawer-container.d.ts +1 -1
- package/drawer/drawer-container.scss +25 -4
- package/drawer/drawer-module.d.ts +5 -5
- package/esm2022/alert/alert-module.mjs +6 -7
- package/esm2022/alert/alert.mjs +11 -18
- package/esm2022/button/button-loading.mjs +13 -23
- package/esm2022/button/button-module.mjs +6 -7
- package/esm2022/checkbox-group/checkbox-group-module.mjs +6 -7
- package/esm2022/checkbox-group/checkbox-group.mjs +19 -31
- package/esm2022/colorpicker/colorpicker-input.mjs +14 -14
- package/esm2022/colorpicker/colorpicker-module.mjs +20 -19
- package/esm2022/colorpicker/colorpicker-toggle.mjs +19 -18
- package/esm2022/colorpicker/colorpicker.mjs +46 -44
- package/esm2022/column-resize/column-resize-directives/column-resize-flex.mjs +6 -5
- package/esm2022/column-resize/column-resize-directives/column-resize.mjs +6 -5
- package/esm2022/column-resize/column-resize-module.mjs +6 -6
- package/esm2022/column-resize/column-resize-notifier.mjs +7 -7
- package/esm2022/column-resize/column-resize.mjs +4 -4
- package/esm2022/column-resize/column-size-store.mjs +3 -3
- package/esm2022/column-resize/event-dispatcher.mjs +5 -5
- package/esm2022/column-resize/overlay-handle.mjs +4 -4
- package/esm2022/column-resize/polyfill.mjs +1 -1
- package/esm2022/column-resize/resizable.mjs +4 -4
- package/esm2022/column-resize/resize-strategy.mjs +14 -14
- package/esm2022/core/datetime/datetime-adapter.mjs +1 -1
- package/esm2022/core/datetime/datetime.module.mjs +19 -23
- package/esm2022/core/datetime/native-datetime-adapter.mjs +6 -6
- package/esm2022/core/pipes/is-template-ref.pipe.mjs +5 -5
- package/esm2022/core/pipes/pipes.module.mjs +6 -7
- package/esm2022/core/pipes/to-observable.pipe.mjs +5 -5
- package/esm2022/datetimepicker/calendar-body.mjs +5 -6
- package/esm2022/datetimepicker/calendar.mjs +38 -48
- package/esm2022/datetimepicker/clock.mjs +11 -11
- package/esm2022/datetimepicker/datetimepicker-errors.mjs +4 -3
- package/esm2022/datetimepicker/datetimepicker-input.mjs +14 -14
- package/esm2022/datetimepicker/datetimepicker-intl.mjs +3 -3
- package/esm2022/datetimepicker/datetimepicker-module.mjs +28 -11
- package/esm2022/datetimepicker/datetimepicker-toggle.mjs +19 -18
- package/esm2022/datetimepicker/datetimepicker.mjs +70 -89
- package/esm2022/datetimepicker/month-view.mjs +8 -10
- package/esm2022/datetimepicker/multi-year-view.mjs +10 -11
- package/esm2022/datetimepicker/time.mjs +19 -24
- package/esm2022/datetimepicker/year-view.mjs +10 -11
- package/esm2022/dialog/dialog-container.mjs +21 -12
- package/esm2022/dialog/dialog-module.mjs +23 -7
- package/esm2022/dialog/dialog.mjs +7 -6
- package/esm2022/drawer/drawer-container.mjs +7 -8
- package/esm2022/drawer/drawer-module.mjs +6 -7
- package/esm2022/drawer/drawer-ref.mjs +1 -1
- package/esm2022/drawer/drawer.mjs +8 -7
- package/esm2022/grid/cell.mjs +36 -14
- package/esm2022/grid/column-menu.mjs +31 -15
- package/esm2022/grid/column-resize/column-resize-directives/column-resize-flex.mjs +6 -5
- package/esm2022/grid/column-resize/column-resize-directives/column-resize.mjs +6 -5
- package/esm2022/grid/column-resize/column-resize-module.mjs +14 -14
- package/esm2022/grid/column-resize/index.mjs +8 -0
- package/esm2022/grid/column-resize/overlay-handle.mjs +7 -6
- package/esm2022/grid/column-resize/resizable-directives/resizable.mjs +7 -6
- package/esm2022/grid/column-resize/resize-strategy.mjs +5 -5
- package/esm2022/grid/expansion-toggle.mjs +6 -5
- package/esm2022/grid/grid-module.mjs +39 -37
- package/esm2022/grid/grid-pipes.mjs +30 -30
- package/esm2022/grid/grid-utils.mjs +7 -6
- package/esm2022/grid/grid.mjs +175 -111
- package/esm2022/loader/loader-module.mjs +6 -7
- package/esm2022/loader/loader.mjs +17 -29
- package/esm2022/photoviewer/photoviewer-module.mjs +6 -7
- package/esm2022/photoviewer/photoviewer.mjs +8 -7
- package/esm2022/popover/popover-content.mjs +10 -9
- package/esm2022/popover/popover-module.mjs +22 -7
- package/esm2022/popover/popover-target.mjs +6 -5
- package/esm2022/popover/popover-trigger.mjs +15 -8
- package/esm2022/popover/popover.mjs +54 -139
- package/esm2022/progress/progress-module.mjs +6 -7
- package/esm2022/progress/progress.mjs +15 -26
- package/esm2022/select/option.mjs +12 -17
- package/esm2022/select/select-module.mjs +20 -9
- package/esm2022/select/select.mjs +19 -19
- package/esm2022/select/templates.mjs +56 -56
- package/esm2022/split/split-module.mjs +6 -7
- package/esm2022/split/split-pane.mjs +6 -5
- package/esm2022/split/split.mjs +8 -8
- package/esm2022/split/utils.mjs +1 -1
- package/esm2022/tooltip/tooltip-module.mjs +24 -7
- package/esm2022/tooltip/tooltip.mjs +104 -117
- package/fesm2022/mtxAlert.mjs +15 -23
- package/fesm2022/mtxAlert.mjs.map +1 -1
- package/fesm2022/mtxButton.mjs +17 -28
- package/fesm2022/mtxButton.mjs.map +1 -1
- package/fesm2022/mtxCheckboxGroup.mjs +22 -37
- package/fesm2022/mtxCheckboxGroup.mjs.map +1 -1
- package/fesm2022/mtxColorpicker.mjs +479 -474
- package/fesm2022/mtxColorpicker.mjs.map +1 -1
- package/fesm2022/mtxColumnResize.mjs +51 -49
- package/fesm2022/mtxColumnResize.mjs.map +1 -1
- package/fesm2022/mtxCore.mjs +36 -41
- package/fesm2022/mtxCore.mjs.map +1 -1
- package/fesm2022/mtxDatetimepicker.mjs +898 -905
- package/fesm2022/mtxDatetimepicker.mjs.map +1 -1
- package/fesm2022/mtxDialog.mjs +47 -25
- package/fesm2022/mtxDialog.mjs.map +1 -1
- package/fesm2022/mtxDrawer.mjs +20 -21
- package/fesm2022/mtxDrawer.mjs.map +1 -1
- package/fesm2022/mtxGrid.mjs +330 -229
- package/fesm2022/mtxGrid.mjs.map +1 -1
- package/fesm2022/mtxLoader.mjs +21 -36
- package/fesm2022/mtxLoader.mjs.map +1 -1
- package/fesm2022/mtxPhotoviewer.mjs +12 -12
- package/fesm2022/mtxPhotoviewer.mjs.map +1 -1
- package/fesm2022/mtxPopover.mjs +103 -165
- package/fesm2022/mtxPopover.mjs.map +1 -1
- package/fesm2022/mtxProgress.mjs +19 -32
- package/fesm2022/mtxProgress.mjs.map +1 -1
- package/fesm2022/mtxSelect.mjs +99 -93
- package/fesm2022/mtxSelect.mjs.map +1 -1
- package/fesm2022/mtxSplit.mjs +17 -18
- package/fesm2022/mtxSplit.mjs.map +1 -1
- package/fesm2022/mtxTooltip.mjs +128 -125
- package/fesm2022/mtxTooltip.mjs.map +1 -1
- package/grid/_grid-theme.scss +58 -29
- package/grid/cell.d.ts +1 -1
- package/grid/column-menu.d.ts +1 -1
- package/grid/column-resize/column-resize-directives/column-resize-flex.d.ts +1 -1
- package/grid/column-resize/column-resize-directives/column-resize.d.ts +1 -1
- package/grid/column-resize/column-resize-module.d.ts +7 -6
- package/grid/column-resize/index.d.ts +7 -0
- package/grid/column-resize/overlay-handle.d.ts +1 -1
- package/grid/column-resize/resizable-directives/resizable.d.ts +1 -1
- package/grid/expansion-toggle.d.ts +1 -1
- package/grid/grid-module.d.ts +25 -25
- package/grid/grid-pipes.d.ts +7 -7
- package/grid/grid.d.ts +57 -25
- package/grid/grid.scss +8 -1
- package/loader/_loader-theme.scss +55 -22
- package/loader/loader-module.d.ts +5 -5
- package/loader/loader.d.ts +5 -10
- package/loader/loader.scss +1 -1
- package/package.json +13 -19
- package/photoviewer/photoviewer-module.d.ts +1 -1
- package/photoviewer/photoviewer.d.ts +2 -1
- package/popover/_popover-theme.scss +55 -22
- package/popover/popover-content.d.ts +1 -1
- package/popover/popover-module.d.ts +8 -8
- package/popover/popover-target.d.ts +1 -1
- package/popover/popover-trigger.d.ts +1 -1
- package/popover/popover.d.ts +24 -55
- package/popover/popover.scss +1 -1
- package/prebuilt-themes/deeppurple-amber.css +1 -1
- package/prebuilt-themes/indigo-pink.css +1 -1
- package/prebuilt-themes/pink-bluegrey.css +1 -1
- package/prebuilt-themes/purple-green.css +1 -1
- package/progress/_progress-theme.scss +60 -22
- package/progress/progress-module.d.ts +3 -3
- package/progress/progress.d.ts +5 -10
- package/progress/progress.scss +3 -3
- package/select/_select-theme.scss +66 -34
- package/select/option.d.ts +3 -6
- package/select/select-module.d.ts +7 -7
- package/select/select.d.ts +2 -4
- package/select/select.scss +109 -109
- package/select/templates.d.ts +11 -11
- package/split/_split-theme.scss +62 -32
- package/split/split-module.d.ts +4 -4
- package/split/split-pane.d.ts +1 -1
- package/split/split.d.ts +1 -1
- package/split/split.scss +2 -4
- package/tooltip/_tooltip-theme.scss +66 -34
- package/tooltip/tooltip-module.d.ts +7 -7
- package/tooltip/tooltip.d.ts +30 -44
- package/tooltip/tooltip.scss +2 -4
- package/_theming.scss +0 -16
- package/alert/_alert-theme.import.scss +0 -2
- package/button/_button-theme.import.scss +0 -2
- package/colorpicker/_colorpicker-theme.import.scss +0 -2
- package/core/density/_compatibility.scss +0 -74
- package/core/mdc-helpers/_mdc-helpers.scss +0 -242
- package/core/style/_elevation.scss +0 -91
- package/core/style/_private.scss +0 -32
- package/core/style/_variables.scss +0 -44
- package/core/style/_vendor-prefixes.scss +0 -46
- package/core/theming/_palette.scss +0 -746
- package/core/theming/_theming.scss +0 -497
- package/core/typography/_typography-utils.scss +0 -101
- package/datetimepicker/_datetimepicker-theme.import.scss +0 -4
- package/drawer/_drawer-theme.import.scss +0 -2
- package/grid/_grid-theme.import.scss +0 -2
- package/loader/_loader-theme.import.scss +0 -2
- package/popover/_popover-theme.import.scss +0 -2
- package/progress/_progress-theme.import.scss +0 -2
- package/select/_select-density.scss +0 -68
- package/select/_select-theme.import.scss +0 -3
- package/split/_split-theme.import.scss +0 -2
- package/tooltip/_tooltip-theme.import.scss +0 -1
package/fesm2022/mtxSelect.mjs
CHANGED
|
@@ -1,40 +1,32 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component, ChangeDetectionStrategy, Input, Directive, InjectionToken, EventEmitter, TemplateRef, ViewEncapsulation, Optional, Self, Inject, ViewChild, ContentChild, ContentChildren, Output, NgModule } from '@angular/core';
|
|
3
|
-
import
|
|
4
|
-
import { CommonModule } from '@angular/common';
|
|
2
|
+
import { booleanAttribute, Component, ChangeDetectionStrategy, Input, Directive, InjectionToken, EventEmitter, TemplateRef, ViewEncapsulation, Optional, Self, Inject, ViewChild, ContentChild, ContentChildren, Output, NgModule } from '@angular/core';
|
|
3
|
+
import { NgTemplateOutlet, CommonModule } from '@angular/common';
|
|
5
4
|
import * as i3 from '@angular/forms';
|
|
6
5
|
import { Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
7
|
-
import * as
|
|
6
|
+
import * as i4 from '@ng-select/ng-select';
|
|
8
7
|
import { NgSelectModule } from '@ng-select/ng-select';
|
|
9
|
-
import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
|
10
8
|
import * as i2 from '@angular/material/core';
|
|
11
|
-
import {
|
|
12
|
-
import * as
|
|
9
|
+
import { mixinErrorState, mixinDisabled } from '@angular/material/core';
|
|
10
|
+
import * as i5 from '@angular/material/form-field';
|
|
13
11
|
import { MAT_FORM_FIELD, MatFormFieldControl } from '@angular/material/form-field';
|
|
14
12
|
import { Subject, merge } from 'rxjs';
|
|
15
13
|
import { takeUntil, startWith } from 'rxjs/operators';
|
|
16
14
|
import * as i1 from '@angular/cdk/a11y';
|
|
17
15
|
|
|
18
16
|
class MtxOption {
|
|
19
|
-
get disabled() {
|
|
20
|
-
return this._disabled;
|
|
21
|
-
}
|
|
22
|
-
set disabled(value) {
|
|
23
|
-
this._disabled = coerceBooleanProperty(value);
|
|
24
|
-
}
|
|
25
17
|
get label() {
|
|
26
18
|
return (this.elementRef.nativeElement.textContent || '').trim();
|
|
27
19
|
}
|
|
28
20
|
constructor(elementRef) {
|
|
29
21
|
this.elementRef = elementRef;
|
|
30
|
-
this.
|
|
22
|
+
this.disabled = false;
|
|
31
23
|
this.stateChange$ = new Subject();
|
|
32
24
|
}
|
|
33
25
|
ngOnChanges(changes) {
|
|
34
26
|
if (changes.disabled) {
|
|
35
27
|
this.stateChange$.next({
|
|
36
28
|
value: this.value,
|
|
37
|
-
disabled: this.
|
|
29
|
+
disabled: this.disabled,
|
|
38
30
|
});
|
|
39
31
|
}
|
|
40
32
|
}
|
|
@@ -43,7 +35,7 @@ class MtxOption {
|
|
|
43
35
|
this._previousLabel = this.label;
|
|
44
36
|
this.stateChange$.next({
|
|
45
37
|
value: this.value,
|
|
46
|
-
disabled: this.
|
|
38
|
+
disabled: this.disabled,
|
|
47
39
|
label: this.elementRef.nativeElement.innerHTML,
|
|
48
40
|
});
|
|
49
41
|
}
|
|
@@ -51,144 +43,146 @@ class MtxOption {
|
|
|
51
43
|
ngOnDestroy() {
|
|
52
44
|
this.stateChange$.complete();
|
|
53
45
|
}
|
|
54
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
55
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
46
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxOption, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
47
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "17.1.0", type: MtxOption, isStandalone: true, selector: "mtx-option", inputs: { value: "value", disabled: ["disabled", "disabled", booleanAttribute] }, exportAs: ["mtxOption"], usesOnChanges: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
56
48
|
}
|
|
57
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
49
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxOption, decorators: [{
|
|
58
50
|
type: Component,
|
|
59
51
|
args: [{
|
|
60
52
|
selector: 'mtx-option',
|
|
61
53
|
exportAs: 'mtxOption',
|
|
62
54
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
63
55
|
template: `<ng-content></ng-content>`,
|
|
56
|
+
standalone: true,
|
|
64
57
|
}]
|
|
65
|
-
}], ctorParameters:
|
|
58
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { value: [{
|
|
66
59
|
type: Input
|
|
67
60
|
}], disabled: [{
|
|
68
|
-
type: Input
|
|
61
|
+
type: Input,
|
|
62
|
+
args: [{ transform: booleanAttribute }]
|
|
69
63
|
}] } });
|
|
70
64
|
|
|
71
65
|
class MtxSelectOptionTemplate {
|
|
72
66
|
constructor(template) {
|
|
73
67
|
this.template = template;
|
|
74
68
|
}
|
|
75
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
76
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
69
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectOptionTemplate, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
70
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: MtxSelectOptionTemplate, isStandalone: true, selector: "[ng-option-tmp]", ngImport: i0 }); }
|
|
77
71
|
}
|
|
78
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
72
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectOptionTemplate, decorators: [{
|
|
79
73
|
type: Directive,
|
|
80
|
-
args: [{ selector: '[ng-option-tmp]' }]
|
|
81
|
-
}], ctorParameters:
|
|
74
|
+
args: [{ selector: '[ng-option-tmp]', standalone: true }]
|
|
75
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
82
76
|
class MtxSelectOptgroupTemplate {
|
|
83
77
|
constructor(template) {
|
|
84
78
|
this.template = template;
|
|
85
79
|
}
|
|
86
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
87
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
80
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectOptgroupTemplate, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
81
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: MtxSelectOptgroupTemplate, isStandalone: true, selector: "[ng-optgroup-tmp]", ngImport: i0 }); }
|
|
88
82
|
}
|
|
89
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
83
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectOptgroupTemplate, decorators: [{
|
|
90
84
|
type: Directive,
|
|
91
|
-
args: [{ selector: '[ng-optgroup-tmp]' }]
|
|
92
|
-
}], ctorParameters:
|
|
85
|
+
args: [{ selector: '[ng-optgroup-tmp]', standalone: true }]
|
|
86
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
93
87
|
class MtxSelectLabelTemplate {
|
|
94
88
|
constructor(template) {
|
|
95
89
|
this.template = template;
|
|
96
90
|
}
|
|
97
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
98
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
91
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectLabelTemplate, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
92
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: MtxSelectLabelTemplate, isStandalone: true, selector: "[ng-label-tmp]", ngImport: i0 }); }
|
|
99
93
|
}
|
|
100
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
94
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectLabelTemplate, decorators: [{
|
|
101
95
|
type: Directive,
|
|
102
|
-
args: [{ selector: '[ng-label-tmp]' }]
|
|
103
|
-
}], ctorParameters:
|
|
96
|
+
args: [{ selector: '[ng-label-tmp]', standalone: true }]
|
|
97
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
104
98
|
class MtxSelectMultiLabelTemplate {
|
|
105
99
|
constructor(template) {
|
|
106
100
|
this.template = template;
|
|
107
101
|
}
|
|
108
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
109
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
102
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectMultiLabelTemplate, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
103
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: MtxSelectMultiLabelTemplate, isStandalone: true, selector: "[ng-multi-label-tmp]", ngImport: i0 }); }
|
|
110
104
|
}
|
|
111
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
105
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectMultiLabelTemplate, decorators: [{
|
|
112
106
|
type: Directive,
|
|
113
|
-
args: [{ selector: '[ng-multi-label-tmp]' }]
|
|
114
|
-
}], ctorParameters:
|
|
107
|
+
args: [{ selector: '[ng-multi-label-tmp]', standalone: true }]
|
|
108
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
115
109
|
class MtxSelectHeaderTemplate {
|
|
116
110
|
constructor(template) {
|
|
117
111
|
this.template = template;
|
|
118
112
|
}
|
|
119
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
120
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
113
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectHeaderTemplate, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
114
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: MtxSelectHeaderTemplate, isStandalone: true, selector: "[ng-header-tmp]", ngImport: i0 }); }
|
|
121
115
|
}
|
|
122
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
116
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectHeaderTemplate, decorators: [{
|
|
123
117
|
type: Directive,
|
|
124
|
-
args: [{ selector: '[ng-header-tmp]' }]
|
|
125
|
-
}], ctorParameters:
|
|
118
|
+
args: [{ selector: '[ng-header-tmp]', standalone: true }]
|
|
119
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
126
120
|
class MtxSelectFooterTemplate {
|
|
127
121
|
constructor(template) {
|
|
128
122
|
this.template = template;
|
|
129
123
|
}
|
|
130
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
131
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
124
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectFooterTemplate, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
125
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: MtxSelectFooterTemplate, isStandalone: true, selector: "[ng-footer-tmp]", ngImport: i0 }); }
|
|
132
126
|
}
|
|
133
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
127
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectFooterTemplate, decorators: [{
|
|
134
128
|
type: Directive,
|
|
135
|
-
args: [{ selector: '[ng-footer-tmp]' }]
|
|
136
|
-
}], ctorParameters:
|
|
129
|
+
args: [{ selector: '[ng-footer-tmp]', standalone: true }]
|
|
130
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
137
131
|
class MtxSelectNotFoundTemplate {
|
|
138
132
|
constructor(template) {
|
|
139
133
|
this.template = template;
|
|
140
134
|
}
|
|
141
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
142
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
135
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectNotFoundTemplate, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
136
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: MtxSelectNotFoundTemplate, isStandalone: true, selector: "[ng-notfound-tmp]", ngImport: i0 }); }
|
|
143
137
|
}
|
|
144
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
138
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectNotFoundTemplate, decorators: [{
|
|
145
139
|
type: Directive,
|
|
146
|
-
args: [{ selector: '[ng-notfound-tmp]' }]
|
|
147
|
-
}], ctorParameters:
|
|
140
|
+
args: [{ selector: '[ng-notfound-tmp]', standalone: true }]
|
|
141
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
148
142
|
class MtxSelectTypeToSearchTemplate {
|
|
149
143
|
constructor(template) {
|
|
150
144
|
this.template = template;
|
|
151
145
|
}
|
|
152
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
153
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
146
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectTypeToSearchTemplate, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
147
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: MtxSelectTypeToSearchTemplate, isStandalone: true, selector: "[ng-typetosearch-tmp]", ngImport: i0 }); }
|
|
154
148
|
}
|
|
155
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
149
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectTypeToSearchTemplate, decorators: [{
|
|
156
150
|
type: Directive,
|
|
157
|
-
args: [{ selector: '[ng-typetosearch-tmp]' }]
|
|
158
|
-
}], ctorParameters:
|
|
151
|
+
args: [{ selector: '[ng-typetosearch-tmp]', standalone: true }]
|
|
152
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
159
153
|
class MtxSelectLoadingTextTemplate {
|
|
160
154
|
constructor(template) {
|
|
161
155
|
this.template = template;
|
|
162
156
|
}
|
|
163
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
164
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
157
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectLoadingTextTemplate, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
158
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: MtxSelectLoadingTextTemplate, isStandalone: true, selector: "[ng-loadingtext-tmp]", ngImport: i0 }); }
|
|
165
159
|
}
|
|
166
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
160
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectLoadingTextTemplate, decorators: [{
|
|
167
161
|
type: Directive,
|
|
168
|
-
args: [{ selector: '[ng-loadingtext-tmp]' }]
|
|
169
|
-
}], ctorParameters:
|
|
162
|
+
args: [{ selector: '[ng-loadingtext-tmp]', standalone: true }]
|
|
163
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
170
164
|
class MtxSelectTagTemplate {
|
|
171
165
|
constructor(template) {
|
|
172
166
|
this.template = template;
|
|
173
167
|
}
|
|
174
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
175
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
168
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectTagTemplate, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
169
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: MtxSelectTagTemplate, isStandalone: true, selector: "[ng-tag-tmp]", ngImport: i0 }); }
|
|
176
170
|
}
|
|
177
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
171
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectTagTemplate, decorators: [{
|
|
178
172
|
type: Directive,
|
|
179
|
-
args: [{ selector: '[ng-tag-tmp]' }]
|
|
180
|
-
}], ctorParameters:
|
|
173
|
+
args: [{ selector: '[ng-tag-tmp]', standalone: true }]
|
|
174
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
181
175
|
class MtxSelectLoadingSpinnerTemplate {
|
|
182
176
|
constructor(template) {
|
|
183
177
|
this.template = template;
|
|
184
178
|
}
|
|
185
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
186
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
179
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectLoadingSpinnerTemplate, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
180
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: MtxSelectLoadingSpinnerTemplate, isStandalone: true, selector: "[ng-loadingspinner-tmp]", ngImport: i0 }); }
|
|
187
181
|
}
|
|
188
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
182
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectLoadingSpinnerTemplate, decorators: [{
|
|
189
183
|
type: Directive,
|
|
190
|
-
args: [{ selector: '[ng-loadingspinner-tmp]' }]
|
|
191
|
-
}], ctorParameters:
|
|
184
|
+
args: [{ selector: '[ng-loadingspinner-tmp]', standalone: true }]
|
|
185
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }] });
|
|
192
186
|
|
|
193
187
|
/** Injection token that can be used to specify default select options. */
|
|
194
188
|
const MTX_SELECT_DEFAULT_OPTIONS = new InjectionToken('mtx-select-default-options');
|
|
@@ -274,7 +268,7 @@ class MtxSelect extends _MtxSelectMixinBase {
|
|
|
274
268
|
return this._required ?? this.ngControl?.control?.hasValidator(Validators.required) ?? false;
|
|
275
269
|
}
|
|
276
270
|
set required(value) {
|
|
277
|
-
this._required =
|
|
271
|
+
this._required = value;
|
|
278
272
|
this.stateChanges.next();
|
|
279
273
|
}
|
|
280
274
|
/** Whether or not the overlay panel is open. */
|
|
@@ -525,10 +519,10 @@ class MtxSelect extends _MtxSelectMixinBase {
|
|
|
525
519
|
dropdownEl.classList.add('mat-' + this._parentFormField?.color);
|
|
526
520
|
});
|
|
527
521
|
}
|
|
528
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
529
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.7", type: MtxSelect, selector: "mtx-select", inputs: { disabled: "disabled", addTag: "addTag", addTagText: "addTagText", appearance: "appearance", appendTo: "appendTo", bindLabel: "bindLabel", bindValue: "bindValue", closeOnSelect: "closeOnSelect", clearAllText: "clearAllText", clearable: "clearable", clearOnBackspace: "clearOnBackspace", compareWith: "compareWith", dropdownPosition: "dropdownPosition", groupBy: "groupBy", groupValue: "groupValue", selectableGroup: "selectableGroup", selectableGroupAsModel: "selectableGroupAsModel", hideSelected: "hideSelected", isOpen: "isOpen", loading: "loading", loadingText: "loadingText", labelForId: "labelForId", markFirst: "markFirst", maxSelectedItems: "maxSelectedItems", multiple: "multiple", notFoundText: "notFoundText", searchable: "searchable", readonly: "readonly", searchFn: "searchFn", searchWhileComposing: "searchWhileComposing", selectOnTab: "selectOnTab", trackByFn: "trackByFn", inputAttrs: "inputAttrs", tabIndex: "tabIndex", openOnEnter: "openOnEnter", minTermLength: "minTermLength", editableSearchTerm: "editableSearchTerm", keyDownFn: "keyDownFn", virtualScroll: "virtualScroll", typeToSearchText: "typeToSearchText", typeahead: "typeahead", clearSearchOnAdd: "clearSearchOnAdd", items: "items", value: "value", id: "id", placeholder: "placeholder", required: "required", errorStateMatcher: "errorStateMatcher", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { blurEvent: "blur", focusEvent: "focus", changeEvent: "change", openEvent: "open", closeEvent: "close", searchEvent: "search", clearEvent: "clear", addEvent: "add", removeEvent: "remove", scroll: "scroll", scrollToEnd: "scrollToEnd" }, host: { attributes: { "role": "combobox", "aria-autocomplete": "none" }, properties: { "attr.id": "id", "attr.aria-expanded": "panelOpen", "attr.aria-label": "ariaLabel || null", "attr.aria-labelledby": "_getAriaLabelledby()", "attr.aria-describedby": "_ariaDescribedby || null", "attr.aria-required": "required.toString()", "attr.aria-disabled": "disabled.toString()", "attr.aria-invalid": "errorState", "class.mtx-select-floating": "shouldLabelFloat", "class.mtx-select-disabled": "disabled", "class.mtx-select-invalid": "errorState", "class.mtx-select-required": "required", "class.mtx-select-empty": "empty", "class.mtx-select-multiple": "multiple" }, classAttribute: "mtx-select" }, providers: [{ provide: MatFormFieldControl, useExisting: MtxSelect }], queries: [{ propertyName: "optionTemplate", first: true, predicate: MtxSelectOptionTemplate, descendants: true, read: TemplateRef }, { propertyName: "optgroupTemplate", first: true, predicate: MtxSelectOptgroupTemplate, descendants: true, read: TemplateRef }, { propertyName: "labelTemplate", first: true, predicate: MtxSelectLabelTemplate, descendants: true, read: TemplateRef }, { propertyName: "multiLabelTemplate", first: true, predicate: MtxSelectMultiLabelTemplate, descendants: true, read: TemplateRef }, { propertyName: "headerTemplate", first: true, predicate: MtxSelectHeaderTemplate, descendants: true, read: TemplateRef }, { propertyName: "footerTemplate", first: true, predicate: MtxSelectFooterTemplate, descendants: true, read: TemplateRef }, { propertyName: "notFoundTemplate", first: true, predicate: MtxSelectNotFoundTemplate, descendants: true, read: TemplateRef }, { propertyName: "typeToSearchTemplate", first: true, predicate: MtxSelectTypeToSearchTemplate, descendants: true, read: TemplateRef }, { propertyName: "loadingTextTemplate", first: true, predicate: MtxSelectLoadingTextTemplate, descendants: true, read: TemplateRef }, { propertyName: "tagTemplate", first: true, predicate: MtxSelectTagTemplate, descendants: true, read: TemplateRef }, { propertyName: "loadingSpinnerTemplate", first: true, predicate: MtxSelectLoadingSpinnerTemplate, descendants: true, read: TemplateRef }, { propertyName: "mtxOptions", predicate: MtxOption, descendants: true }], viewQueries: [{ propertyName: "ngSelect", first: true, predicate: ["ngSelect"], descendants: true, static: true }], exportAs: ["mtxSelect"], usesInheritance: true, ngImport: i0, template: "<ng-select #ngSelect\n [class.ng-select-invalid]=\"errorState\"\n [(ngModel)]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n [placeholder]=\"placeholder\"\n [items]=\"items\"\n [addTag]=\"addTag\"\n [addTagText]=\"addTagText\"\n [appendTo]=\"appendTo\"\n [appearance]=\"appearance\"\n [bindLabel]=\"bindLabel!\"\n [bindValue]=\"bindValue!\"\n [closeOnSelect]=\"closeOnSelect\"\n [clearAllText]=\"clearAllText\"\n [clearable]=\"clearable\"\n [clearOnBackspace]=\"clearOnBackspace\"\n [dropdownPosition]=\"dropdownPosition\"\n [groupBy]=\"groupBy\"\n [groupValue]=\"groupValue\"\n [hideSelected]=\"hideSelected\"\n [isOpen]=\"isOpen\"\n [inputAttrs]=\"inputAttrs\"\n [loading]=\"loading\"\n [loadingText]=\"loadingText\"\n [labelForId]=\"labelForId\"\n [markFirst]=\"markFirst\"\n [maxSelectedItems]=\"maxSelectedItems\"\n [multiple]=\"multiple\"\n [notFoundText]=\"notFoundText\"\n [readonly]=\"readonly\"\n [typeahead]=\"typeahead\"\n [typeToSearchText]=\"typeToSearchText\"\n [trackByFn]=\"trackByFn\"\n [searchable]=\"searchable\"\n [searchFn]=\"searchFn\"\n [searchWhileComposing]=\"searchWhileComposing\"\n [clearSearchOnAdd]=\"clearSearchOnAdd\"\n [selectableGroup]=\"selectableGroup\"\n [selectableGroupAsModel]=\"selectableGroupAsModel\"\n [selectOnTab]=\"selectOnTab\"\n [tabIndex]=\"tabIndex\"\n [openOnEnter]=\"openOnEnter\"\n [minTermLength]=\"minTermLength\"\n [editableSearchTerm]=\"editableSearchTerm\"\n [keyDownFn]=\"keyDownFn\"\n [virtualScroll]=\"virtualScroll\"\n (blur)=\"blurEvent.emit($event)\"\n (focus)=\"focusEvent.emit($event)\"\n (change)=\"changeEvent.emit($event)\"\n (open)=\"openChange()\"\n (close)=\"closeEvent.emit()\"\n (search)=\"searchEvent.emit($event)\"\n (clear)=\"clearEvent.emit($event)\"\n (add)=\"addEvent.emit($event)\"\n (remove)=\"removeEvent.emit($event)\"\n (scroll)=\"scroll.emit($event)\"\n (scrollToEnd)=\"scrollToEnd.emit()\">\n\n <ng-container *ngIf=\"optionTemplate\">\n <ng-template ng-option-tmp let-item=\"item\" let-item$=\"item$\" let-index=\"index\"\n let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"optionTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, item$: item$, index: index, searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"optgroupTemplate\">\n <ng-template ng-optgroup-tmp let-item=\"item\" let-item$=\"item$\" let-index=\"index\"\n let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"optgroupTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, item$: item$, index: index, searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"labelTemplate\">\n <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\" let-label=\"label\">\n <ng-template [ngTemplateOutlet]=\"labelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, clear: clear, label: label }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"multiLabelTemplate\">\n <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\">\n <ng-template [ngTemplateOutlet]=\"multiLabelTemplate\"\n [ngTemplateOutletContext]=\"{ items: items, clear: clear }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"headerTemplate\">\n <ng-template ng-header-tmp>\n <ng-template [ngTemplateOutlet]=\"headerTemplate\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"footerTemplate\">\n <ng-template ng-footer-tmp>\n <ng-template [ngTemplateOutlet]=\"footerTemplate\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"notFoundTemplate\">\n <ng-template ng-notfound-tmp let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"notFoundTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"typeToSearchTemplate\">\n <ng-template ng-typetosearch-tmp>\n <ng-template [ngTemplateOutlet]=\"typeToSearchTemplate\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"loadingTextTemplate\">\n <ng-template ng-loadingtext-tmp let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"loadingTextTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"tagTemplate\">\n <ng-template ng-tag-tmp let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"tagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"loadingSpinnerTemplate\">\n <ng-template ng-loadingspinner-tmp>\n <ng-template [ngTemplateOutlet]=\"loadingSpinnerTemplate\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n</ng-select>\n", styles: [".ng-select{padding-right:16px;padding-left:16px;margin-right:-16px;margin-left:-16px}.ng-select .ng-select-container{align-items:center;color:var(--mtx-select-container-text-color)}.ng-select .ng-select-container .ng-value-container{align-items:center}.ng-select .ng-select-container .ng-value-container .ng-input>input{padding:0;color:inherit;font:inherit}.ng-select .ng-select-container .ng-clear-wrapper{width:24px;text-align:center}.ng-select .ng-placeholder{transition:opacity .2s;opacity:1;color:var(--mtx-select-placeholder-text-color)}.mat-form-field-hide-placeholder .ng-select .ng-placeholder{opacity:0}.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-clear-wrapper{color:var(--mtx-select-clear-icon-color)}.ng-select .ng-clear-wrapper:hover .ng-clear{color:var(--mtx-select-clear-icon-hover-color)}.ng-select.ng-select-disabled .ng-value{color:var(--mtx-select-disabled-text-color)}.ng-select.ng-select-opened .ng-arrow-wrapper .ng-arrow{top:-2px;border-width:0 5px 5px}.ng-select.ng-select-single.ng-select-filtered .ng-placeholder{display:initial;visibility:hidden}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin:2px 4px 2px 0;border-radius:16px;font-size:.875em;line-height:18px;background-color:var(--mtx-select-multiple-value-background-color);border:1px solid var(--mtx-select-multiple-value-border-color)}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin-right:auto;margin-left:4px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled{opacity:.4}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{display:inline-block;margin:0 8px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:inline-block;width:18px;height:18px;border-radius:100%;text-align:center}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{margin-right:-4px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{margin-left:-4px;margin-right:auto}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{margin-left:-4px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{margin-right:-4px;margin-left:auto}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:hover{background-color:var(--mtx-select-multiple-value-icon-hover-background-color)}.ng-select .ng-arrow-wrapper{width:10px}.ng-select .ng-arrow{border-width:5px 5px 2px;border-style:solid;border-color:var(--mtx-select-enabled-arrow-color) transparent transparent}.ng-select.ng-select-disabled .ng-arrow{border-color:var(--mtx-select-disabled-arrow-color) transparent transparent}.ng-select.ng-select-invalid .ng-arrow{border-color:var(--mtx-select-invalid-arrow-color) transparent transparent}.ng-select.ng-select-opened .ng-arrow{border-color:transparent transparent var(--mtx-select-enabled-arrow-color)}.ng-select.ng-select-opened.ng-select-invalid .ng-arrow{border-color:transparent transparent var(--mtx-select-invalid-arrow-color)}.ng-dropdown-panel{background-color:var(--mtx-select-panel-background-color)}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-left-radius:4px;border-bottom-right-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-left-radius:4px;border-top-right-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.ng-dropdown-panel .ng-dropdown-header,.ng-dropdown-panel .ng-dropdown-footer{padding:14px 16px}.ng-dropdown-panel .ng-dropdown-header{border-bottom:1px solid var(--mtx-select-panel-divider-color)}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid var(--mtx-select-panel-divider-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{padding:14px 16px;font-weight:500;-webkit-user-select:none;user-select:none;cursor:pointer;color:var(--mtx-select-optgroup-label-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-disabled{cursor:default}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked{background-color:var(--mtx-select-option-hover-state-background-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected{background-color:var(--mtx-select-option-selected-state-background-color);color:var(--mtx-select-option-selected-state-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{position:relative;padding:14px 16px;text-overflow:ellipsis;text-decoration:none;text-align:left;white-space:nowrap;overflow:hidden;color:var(--mtx-select-option-label-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:var(--mtx-select-option-hover-state-background-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{background-color:var(--mtx-select-option-selected-state-background-color);color:var(--mtx-select-option-selected-state-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:var(--mtx-select-option-disabled-state-text-color)}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{text-align:right}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:32px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-right:32px;padding-left:0}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{margin-right:6px;font-size:80%}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{margin-left:6px;margin-right:0}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i5.NgOptgroupTemplateDirective, selector: "[ng-optgroup-tmp]" }, { kind: "directive", type: i5.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i5.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i5.NgMultiLabelTemplateDirective, selector: "[ng-multi-label-tmp]" }, { kind: "directive", type: i5.NgHeaderTemplateDirective, selector: "[ng-header-tmp]" }, { kind: "directive", type: i5.NgFooterTemplateDirective, selector: "[ng-footer-tmp]" }, { kind: "directive", type: i5.NgNotFoundTemplateDirective, selector: "[ng-notfound-tmp]" }, { kind: "directive", type: i5.NgTypeToSearchTemplateDirective, selector: "[ng-typetosearch-tmp]" }, { kind: "directive", type: i5.NgLoadingTextTemplateDirective, selector: "[ng-loadingtext-tmp]" }, { kind: "directive", type: i5.NgTagTemplateDirective, selector: "[ng-tag-tmp]" }, { kind: "directive", type: i5.NgLoadingSpinnerTemplateDirective, selector: "[ng-loadingspinner-tmp]" }, { kind: "directive", type: MtxSelectOptgroupTemplate, selector: "[ng-optgroup-tmp]" }, { kind: "directive", type: MtxSelectOptionTemplate, selector: "[ng-option-tmp]" }, { kind: "directive", type: MtxSelectLabelTemplate, selector: "[ng-label-tmp]" }, { kind: "directive", type: MtxSelectMultiLabelTemplate, selector: "[ng-multi-label-tmp]" }, { kind: "directive", type: MtxSelectHeaderTemplate, selector: "[ng-header-tmp]" }, { kind: "directive", type: MtxSelectFooterTemplate, selector: "[ng-footer-tmp]" }, { kind: "directive", type: MtxSelectNotFoundTemplate, selector: "[ng-notfound-tmp]" }, { kind: "directive", type: MtxSelectTypeToSearchTemplate, selector: "[ng-typetosearch-tmp]" }, { kind: "directive", type: MtxSelectLoadingTextTemplate, selector: "[ng-loadingtext-tmp]" }, { kind: "directive", type: MtxSelectTagTemplate, selector: "[ng-tag-tmp]" }, { kind: "directive", type: MtxSelectLoadingSpinnerTemplate, selector: "[ng-loadingspinner-tmp]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
522
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelect, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i1.FocusMonitor }, { token: i2.ErrorStateMatcher }, { token: i3.NgForm, optional: true }, { token: i3.FormGroupDirective, optional: true }, { token: i3.NgControl, optional: true, self: true }, { token: MAT_FORM_FIELD, optional: true }, { token: MTX_SELECT_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
523
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.0", type: MtxSelect, isStandalone: true, selector: "mtx-select", inputs: { disabled: "disabled", addTag: "addTag", addTagText: "addTagText", appearance: "appearance", appendTo: "appendTo", bindLabel: "bindLabel", bindValue: "bindValue", closeOnSelect: "closeOnSelect", clearAllText: "clearAllText", clearable: "clearable", clearOnBackspace: "clearOnBackspace", compareWith: "compareWith", dropdownPosition: "dropdownPosition", groupBy: "groupBy", groupValue: "groupValue", selectableGroup: "selectableGroup", selectableGroupAsModel: "selectableGroupAsModel", hideSelected: "hideSelected", isOpen: "isOpen", loading: "loading", loadingText: "loadingText", labelForId: "labelForId", markFirst: "markFirst", maxSelectedItems: "maxSelectedItems", multiple: "multiple", notFoundText: "notFoundText", searchable: "searchable", readonly: "readonly", searchFn: "searchFn", searchWhileComposing: "searchWhileComposing", selectOnTab: "selectOnTab", trackByFn: "trackByFn", inputAttrs: "inputAttrs", tabIndex: "tabIndex", openOnEnter: "openOnEnter", minTermLength: "minTermLength", editableSearchTerm: "editableSearchTerm", keyDownFn: "keyDownFn", virtualScroll: "virtualScroll", typeToSearchText: "typeToSearchText", typeahead: "typeahead", clearSearchOnAdd: "clearSearchOnAdd", items: "items", value: "value", id: "id", placeholder: "placeholder", required: ["required", "required", booleanAttribute], errorStateMatcher: "errorStateMatcher", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { blurEvent: "blur", focusEvent: "focus", changeEvent: "change", openEvent: "open", closeEvent: "close", searchEvent: "search", clearEvent: "clear", addEvent: "add", removeEvent: "remove", scroll: "scroll", scrollToEnd: "scrollToEnd" }, host: { attributes: { "role": "combobox", "aria-autocomplete": "none" }, properties: { "attr.id": "id", "attr.aria-expanded": "panelOpen", "attr.aria-label": "ariaLabel || null", "attr.aria-labelledby": "_getAriaLabelledby()", "attr.aria-describedby": "_ariaDescribedby || null", "attr.aria-required": "required.toString()", "attr.aria-disabled": "disabled.toString()", "attr.aria-invalid": "errorState", "class.mtx-select-floating": "shouldLabelFloat", "class.mtx-select-disabled": "disabled", "class.mtx-select-invalid": "errorState", "class.mtx-select-required": "required", "class.mtx-select-empty": "empty", "class.mtx-select-multiple": "multiple" }, classAttribute: "mtx-select" }, providers: [{ provide: MatFormFieldControl, useExisting: MtxSelect }], queries: [{ propertyName: "optionTemplate", first: true, predicate: MtxSelectOptionTemplate, descendants: true, read: TemplateRef }, { propertyName: "optgroupTemplate", first: true, predicate: MtxSelectOptgroupTemplate, descendants: true, read: TemplateRef }, { propertyName: "labelTemplate", first: true, predicate: MtxSelectLabelTemplate, descendants: true, read: TemplateRef }, { propertyName: "multiLabelTemplate", first: true, predicate: MtxSelectMultiLabelTemplate, descendants: true, read: TemplateRef }, { propertyName: "headerTemplate", first: true, predicate: MtxSelectHeaderTemplate, descendants: true, read: TemplateRef }, { propertyName: "footerTemplate", first: true, predicate: MtxSelectFooterTemplate, descendants: true, read: TemplateRef }, { propertyName: "notFoundTemplate", first: true, predicate: MtxSelectNotFoundTemplate, descendants: true, read: TemplateRef }, { propertyName: "typeToSearchTemplate", first: true, predicate: MtxSelectTypeToSearchTemplate, descendants: true, read: TemplateRef }, { propertyName: "loadingTextTemplate", first: true, predicate: MtxSelectLoadingTextTemplate, descendants: true, read: TemplateRef }, { propertyName: "tagTemplate", first: true, predicate: MtxSelectTagTemplate, descendants: true, read: TemplateRef }, { propertyName: "loadingSpinnerTemplate", first: true, predicate: MtxSelectLoadingSpinnerTemplate, descendants: true, read: TemplateRef }, { propertyName: "mtxOptions", predicate: MtxOption, descendants: true }], viewQueries: [{ propertyName: "ngSelect", first: true, predicate: ["ngSelect"], descendants: true, static: true }], exportAs: ["mtxSelect"], usesInheritance: true, ngImport: i0, template: "<ng-select #ngSelect\n [class.ng-select-invalid]=\"errorState\"\n [(ngModel)]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n [placeholder]=\"placeholder\"\n [items]=\"items\"\n [addTag]=\"addTag\"\n [addTagText]=\"addTagText\"\n [appendTo]=\"appendTo\"\n [appearance]=\"appearance\"\n [bindLabel]=\"bindLabel!\"\n [bindValue]=\"bindValue!\"\n [closeOnSelect]=\"closeOnSelect\"\n [clearAllText]=\"clearAllText\"\n [clearable]=\"clearable\"\n [clearOnBackspace]=\"clearOnBackspace\"\n [dropdownPosition]=\"dropdownPosition\"\n [groupBy]=\"groupBy\"\n [groupValue]=\"groupValue\"\n [hideSelected]=\"hideSelected\"\n [isOpen]=\"isOpen\"\n [inputAttrs]=\"inputAttrs\"\n [loading]=\"loading\"\n [loadingText]=\"loadingText\"\n [labelForId]=\"labelForId\"\n [markFirst]=\"markFirst\"\n [maxSelectedItems]=\"maxSelectedItems\"\n [multiple]=\"multiple\"\n [notFoundText]=\"notFoundText\"\n [readonly]=\"readonly\"\n [typeahead]=\"typeahead\"\n [typeToSearchText]=\"typeToSearchText\"\n [trackByFn]=\"trackByFn\"\n [searchable]=\"searchable\"\n [searchFn]=\"searchFn\"\n [searchWhileComposing]=\"searchWhileComposing\"\n [clearSearchOnAdd]=\"clearSearchOnAdd\"\n [selectableGroup]=\"selectableGroup\"\n [selectableGroupAsModel]=\"selectableGroupAsModel\"\n [selectOnTab]=\"selectOnTab\"\n [tabIndex]=\"tabIndex\"\n [openOnEnter]=\"openOnEnter\"\n [minTermLength]=\"minTermLength\"\n [editableSearchTerm]=\"editableSearchTerm\"\n [keyDownFn]=\"keyDownFn\"\n [virtualScroll]=\"virtualScroll\"\n (blur)=\"blurEvent.emit($event)\"\n (focus)=\"focusEvent.emit($event)\"\n (change)=\"changeEvent.emit($event)\"\n (open)=\"openChange()\"\n (close)=\"closeEvent.emit()\"\n (search)=\"searchEvent.emit($event)\"\n (clear)=\"clearEvent.emit($event)\"\n (add)=\"addEvent.emit($event)\"\n (remove)=\"removeEvent.emit($event)\"\n (scroll)=\"scroll.emit($event)\"\n (scrollToEnd)=\"scrollToEnd.emit()\">\n\n @if (optionTemplate) {\n <ng-template ng-option-tmp let-item=\"item\" let-item$=\"item$\" let-index=\"index\"\n let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"optionTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, item$: item$, index: index, searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n }\n\n @if (optgroupTemplate) {\n <ng-template ng-optgroup-tmp let-item=\"item\" let-item$=\"item$\" let-index=\"index\"\n let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"optgroupTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, item$: item$, index: index, searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n }\n\n @if (labelTemplate) {\n <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\" let-label=\"label\">\n <ng-template [ngTemplateOutlet]=\"labelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, clear: clear, label: label }\">\n </ng-template>\n </ng-template>\n }\n\n @if (multiLabelTemplate) {\n <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\">\n <ng-template [ngTemplateOutlet]=\"multiLabelTemplate\"\n [ngTemplateOutletContext]=\"{ items: items, clear: clear }\">\n </ng-template>\n </ng-template>\n }\n\n @if (headerTemplate) {\n <ng-template ng-header-tmp>\n <ng-template [ngTemplateOutlet]=\"headerTemplate\"></ng-template>\n </ng-template>\n }\n\n @if (footerTemplate) {\n <ng-template ng-footer-tmp>\n <ng-template [ngTemplateOutlet]=\"footerTemplate\"></ng-template>\n </ng-template>\n }\n\n @if (notFoundTemplate) {\n <ng-template ng-notfound-tmp let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"notFoundTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n }\n\n @if (typeToSearchTemplate) {\n <ng-template ng-typetosearch-tmp>\n <ng-template [ngTemplateOutlet]=\"typeToSearchTemplate\"></ng-template>\n </ng-template>\n }\n\n @if (loadingTextTemplate) {\n <ng-template ng-loadingtext-tmp let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"loadingTextTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n }\n\n @if (tagTemplate) {\n <ng-template ng-tag-tmp let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"tagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n }\n\n @if (loadingSpinnerTemplate) {\n <ng-template ng-loadingspinner-tmp>\n <ng-template [ngTemplateOutlet]=\"loadingSpinnerTemplate\"></ng-template>\n </ng-template>\n }\n\n</ng-select>\n", styles: [".ng-select{padding:var(--mat-form-field-filled-with-label-container-padding-top) 16px var(--mat-form-field-filled-with-label-container-padding-bottom);margin:calc(var(--mat-form-field-filled-with-label-container-padding-top) * -1) -16px calc(var(--mat-form-field-filled-with-label-container-padding-bottom) * -1)}.mdc-text-field--outlined .ng-select,.mdc-text-field--no-label .ng-select{padding-top:var(--mat-form-field-container-vertical-padding);padding-bottom:var(--mat-form-field-container-vertical-padding);margin-top:calc(var(--mat-form-field-container-vertical-padding) * -1);margin-bottom:calc(var(--mat-form-field-container-vertical-padding) * -1)}.ng-select .ng-select-container{align-items:center;color:var(--mtx-select-container-text-color)}.ng-select .ng-select-container .ng-value-container{align-items:center}.ng-select .ng-select-container .ng-value-container .ng-input>input{padding:0;color:inherit;font:inherit}.ng-select .ng-select-container .ng-clear-wrapper{width:24px;text-align:center}.ng-select .ng-placeholder{transition:opacity .2s;opacity:1;color:var(--mtx-select-placeholder-text-color)}.mat-form-field-hide-placeholder .ng-select .ng-placeholder{opacity:0}.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-clear-wrapper{color:var(--mtx-select-clear-icon-color)}.ng-select .ng-clear-wrapper:hover .ng-clear{color:var(--mtx-select-clear-icon-hover-color)}.ng-select.ng-select-disabled .ng-value{color:var(--mtx-select-disabled-text-color)}.ng-select.ng-select-opened .ng-arrow-wrapper .ng-arrow{top:-2px;border-width:0 5px 5px}.ng-select.ng-select-single.ng-select-filtered .ng-placeholder{display:initial;visibility:hidden}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin:2px 4px 2px 0;border-radius:16px;font-size:.875em;line-height:18px;background-color:var(--mtx-select-multiple-value-background-color);border:1px solid var(--mtx-select-multiple-value-border-color)}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin-right:auto;margin-left:4px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled{opacity:.4}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{display:inline-block;margin:0 8px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:inline-block;width:18px;height:18px;border-radius:100%;text-align:center}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{margin-right:-4px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{margin-left:-4px;margin-right:auto}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{margin-left:-4px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{margin-right:-4px;margin-left:auto}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:hover{background-color:var(--mtx-select-multiple-value-icon-hover-background-color)}.ng-select .ng-arrow-wrapper{width:10px}.ng-select .ng-arrow{border-width:5px 5px 2px;border-style:solid;border-color:var(--mtx-select-enabled-arrow-color) transparent transparent}.ng-select.ng-select-disabled .ng-arrow{border-color:var(--mtx-select-disabled-arrow-color) transparent transparent}.ng-select.ng-select-invalid .ng-arrow{border-color:var(--mtx-select-invalid-arrow-color) transparent transparent}.ng-select.ng-select-opened .ng-arrow{border-color:transparent transparent var(--mtx-select-enabled-arrow-color)}.ng-select.ng-select-opened.ng-select-invalid .ng-arrow{border-color:transparent transparent var(--mtx-select-invalid-arrow-color)}.ng-dropdown-panel{background-color:var(--mtx-select-panel-background-color)}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-left-radius:var(--mtx-select-container-shape);border-bottom-right-radius:var(--mtx-select-container-shape);box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-left-radius:var(--mtx-select-container-shape);border-top-right-radius:var(--mtx-select-container-shape);box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.ng-dropdown-panel .ng-dropdown-header,.ng-dropdown-panel .ng-dropdown-footer{padding:14px 16px}.ng-dropdown-panel .ng-dropdown-header{border-bottom:1px solid var(--mtx-select-panel-divider-color)}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid var(--mtx-select-panel-divider-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{padding:14px 16px;font-weight:500;-webkit-user-select:none;user-select:none;cursor:pointer;color:var(--mtx-select-optgroup-label-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-disabled{cursor:default}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked{background-color:var(--mtx-select-option-hover-state-background-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected{background-color:var(--mtx-select-option-selected-state-background-color);color:var(--mtx-select-option-selected-state-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{position:relative;padding:14px 16px;text-overflow:ellipsis;text-decoration:none;text-align:left;white-space:nowrap;overflow:hidden;color:var(--mtx-select-option-label-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:var(--mtx-select-option-hover-state-background-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{background-color:var(--mtx-select-option-selected-state-background-color);color:var(--mtx-select-option-selected-state-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:var(--mtx-select-option-disabled-state-text-color)}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{text-align:right}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:32px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-right:32px;padding-left:0}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{margin-right:6px;font-size:80%}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{margin-left:6px;margin-right:0}\n"], dependencies: [{ kind: "ngmodule", type: NgSelectModule }, { kind: "component", type: i4.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i4.NgOptgroupTemplateDirective, selector: "[ng-optgroup-tmp]" }, { kind: "directive", type: i4.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i4.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i4.NgMultiLabelTemplateDirective, selector: "[ng-multi-label-tmp]" }, { kind: "directive", type: i4.NgHeaderTemplateDirective, selector: "[ng-header-tmp]" }, { kind: "directive", type: i4.NgFooterTemplateDirective, selector: "[ng-footer-tmp]" }, { kind: "directive", type: i4.NgNotFoundTemplateDirective, selector: "[ng-notfound-tmp]" }, { kind: "directive", type: i4.NgTypeToSearchTemplateDirective, selector: "[ng-typetosearch-tmp]" }, { kind: "directive", type: i4.NgLoadingTextTemplateDirective, selector: "[ng-loadingtext-tmp]" }, { kind: "directive", type: i4.NgTagTemplateDirective, selector: "[ng-tag-tmp]" }, { kind: "directive", type: i4.NgLoadingSpinnerTemplateDirective, selector: "[ng-loadingspinner-tmp]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
530
524
|
}
|
|
531
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
525
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelect, decorators: [{
|
|
532
526
|
type: Component,
|
|
533
527
|
args: [{ selector: 'mtx-select', exportAs: 'mtxSelect', host: {
|
|
534
528
|
'role': 'combobox',
|
|
@@ -548,8 +542,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
|
|
|
548
542
|
'[class.mtx-select-empty]': 'empty',
|
|
549
543
|
'[class.mtx-select-multiple]': 'multiple',
|
|
550
544
|
'class': 'mtx-select',
|
|
551
|
-
}, inputs: ['disabled'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: MatFormFieldControl, useExisting: MtxSelect }], template: "<ng-select #ngSelect\n [class.ng-select-invalid]=\"errorState\"\n [(ngModel)]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n [placeholder]=\"placeholder\"\n [items]=\"items\"\n [addTag]=\"addTag\"\n [addTagText]=\"addTagText\"\n [appendTo]=\"appendTo\"\n [appearance]=\"appearance\"\n [bindLabel]=\"bindLabel!\"\n [bindValue]=\"bindValue!\"\n [closeOnSelect]=\"closeOnSelect\"\n [clearAllText]=\"clearAllText\"\n [clearable]=\"clearable\"\n [clearOnBackspace]=\"clearOnBackspace\"\n [dropdownPosition]=\"dropdownPosition\"\n [groupBy]=\"groupBy\"\n [groupValue]=\"groupValue\"\n [hideSelected]=\"hideSelected\"\n [isOpen]=\"isOpen\"\n [inputAttrs]=\"inputAttrs\"\n [loading]=\"loading\"\n [loadingText]=\"loadingText\"\n [labelForId]=\"labelForId\"\n [markFirst]=\"markFirst\"\n [maxSelectedItems]=\"maxSelectedItems\"\n [multiple]=\"multiple\"\n [notFoundText]=\"notFoundText\"\n [readonly]=\"readonly\"\n [typeahead]=\"typeahead\"\n [typeToSearchText]=\"typeToSearchText\"\n [trackByFn]=\"trackByFn\"\n [searchable]=\"searchable\"\n [searchFn]=\"searchFn\"\n [searchWhileComposing]=\"searchWhileComposing\"\n [clearSearchOnAdd]=\"clearSearchOnAdd\"\n [selectableGroup]=\"selectableGroup\"\n [selectableGroupAsModel]=\"selectableGroupAsModel\"\n [selectOnTab]=\"selectOnTab\"\n [tabIndex]=\"tabIndex\"\n [openOnEnter]=\"openOnEnter\"\n [minTermLength]=\"minTermLength\"\n [editableSearchTerm]=\"editableSearchTerm\"\n [keyDownFn]=\"keyDownFn\"\n [virtualScroll]=\"virtualScroll\"\n (blur)=\"blurEvent.emit($event)\"\n (focus)=\"focusEvent.emit($event)\"\n (change)=\"changeEvent.emit($event)\"\n (open)=\"openChange()\"\n (close)=\"closeEvent.emit()\"\n (search)=\"searchEvent.emit($event)\"\n (clear)=\"clearEvent.emit($event)\"\n (add)=\"addEvent.emit($event)\"\n (remove)=\"removeEvent.emit($event)\"\n (scroll)=\"scroll.emit($event)\"\n (scrollToEnd)=\"scrollToEnd.emit()\">\n\n <ng-container *ngIf=\"optionTemplate\">\n <ng-template ng-option-tmp let-item=\"item\" let-item$=\"item$\" let-index=\"index\"\n let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"optionTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, item$: item$, index: index, searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"optgroupTemplate\">\n <ng-template ng-optgroup-tmp let-item=\"item\" let-item$=\"item$\" let-index=\"index\"\n let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"optgroupTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, item$: item$, index: index, searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"labelTemplate\">\n <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\" let-label=\"label\">\n <ng-template [ngTemplateOutlet]=\"labelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, clear: clear, label: label }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"multiLabelTemplate\">\n <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\">\n <ng-template [ngTemplateOutlet]=\"multiLabelTemplate\"\n [ngTemplateOutletContext]=\"{ items: items, clear: clear }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"headerTemplate\">\n <ng-template ng-header-tmp>\n <ng-template [ngTemplateOutlet]=\"headerTemplate\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"footerTemplate\">\n <ng-template ng-footer-tmp>\n <ng-template [ngTemplateOutlet]=\"footerTemplate\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"notFoundTemplate\">\n <ng-template ng-notfound-tmp let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"notFoundTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"typeToSearchTemplate\">\n <ng-template ng-typetosearch-tmp>\n <ng-template [ngTemplateOutlet]=\"typeToSearchTemplate\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"loadingTextTemplate\">\n <ng-template ng-loadingtext-tmp let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"loadingTextTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"tagTemplate\">\n <ng-template ng-tag-tmp let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"tagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"loadingSpinnerTemplate\">\n <ng-template ng-loadingspinner-tmp>\n <ng-template [ngTemplateOutlet]=\"loadingSpinnerTemplate\">\n </ng-template>\n </ng-template>\n </ng-container>\n\n</ng-select>\n", styles: [".ng-select{padding-right:16px;padding-left:16px;margin-right:-16px;margin-left:-16px}.ng-select .ng-select-container{align-items:center;color:var(--mtx-select-container-text-color)}.ng-select .ng-select-container .ng-value-container{align-items:center}.ng-select .ng-select-container .ng-value-container .ng-input>input{padding:0;color:inherit;font:inherit}.ng-select .ng-select-container .ng-clear-wrapper{width:24px;text-align:center}.ng-select .ng-placeholder{transition:opacity .2s;opacity:1;color:var(--mtx-select-placeholder-text-color)}.mat-form-field-hide-placeholder .ng-select .ng-placeholder{opacity:0}.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-clear-wrapper{color:var(--mtx-select-clear-icon-color)}.ng-select .ng-clear-wrapper:hover .ng-clear{color:var(--mtx-select-clear-icon-hover-color)}.ng-select.ng-select-disabled .ng-value{color:var(--mtx-select-disabled-text-color)}.ng-select.ng-select-opened .ng-arrow-wrapper .ng-arrow{top:-2px;border-width:0 5px 5px}.ng-select.ng-select-single.ng-select-filtered .ng-placeholder{display:initial;visibility:hidden}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin:2px 4px 2px 0;border-radius:16px;font-size:.875em;line-height:18px;background-color:var(--mtx-select-multiple-value-background-color);border:1px solid var(--mtx-select-multiple-value-border-color)}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin-right:auto;margin-left:4px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled{opacity:.4}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{display:inline-block;margin:0 8px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:inline-block;width:18px;height:18px;border-radius:100%;text-align:center}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{margin-right:-4px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{margin-left:-4px;margin-right:auto}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{margin-left:-4px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{margin-right:-4px;margin-left:auto}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:hover{background-color:var(--mtx-select-multiple-value-icon-hover-background-color)}.ng-select .ng-arrow-wrapper{width:10px}.ng-select .ng-arrow{border-width:5px 5px 2px;border-style:solid;border-color:var(--mtx-select-enabled-arrow-color) transparent transparent}.ng-select.ng-select-disabled .ng-arrow{border-color:var(--mtx-select-disabled-arrow-color) transparent transparent}.ng-select.ng-select-invalid .ng-arrow{border-color:var(--mtx-select-invalid-arrow-color) transparent transparent}.ng-select.ng-select-opened .ng-arrow{border-color:transparent transparent var(--mtx-select-enabled-arrow-color)}.ng-select.ng-select-opened.ng-select-invalid .ng-arrow{border-color:transparent transparent var(--mtx-select-invalid-arrow-color)}.ng-dropdown-panel{background-color:var(--mtx-select-panel-background-color)}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-left-radius:4px;border-bottom-right-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-left-radius:4px;border-top-right-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.ng-dropdown-panel .ng-dropdown-header,.ng-dropdown-panel .ng-dropdown-footer{padding:14px 16px}.ng-dropdown-panel .ng-dropdown-header{border-bottom:1px solid var(--mtx-select-panel-divider-color)}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid var(--mtx-select-panel-divider-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{padding:14px 16px;font-weight:500;-webkit-user-select:none;user-select:none;cursor:pointer;color:var(--mtx-select-optgroup-label-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-disabled{cursor:default}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked{background-color:var(--mtx-select-option-hover-state-background-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected{background-color:var(--mtx-select-option-selected-state-background-color);color:var(--mtx-select-option-selected-state-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{position:relative;padding:14px 16px;text-overflow:ellipsis;text-decoration:none;text-align:left;white-space:nowrap;overflow:hidden;color:var(--mtx-select-option-label-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:var(--mtx-select-option-hover-state-background-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{background-color:var(--mtx-select-option-selected-state-background-color);color:var(--mtx-select-option-selected-state-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:var(--mtx-select-option-disabled-state-text-color)}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{text-align:right}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:32px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-right:32px;padding-left:0}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{margin-right:6px;font-size:80%}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{margin-left:6px;margin-right:0}\n"] }]
|
|
552
|
-
}], ctorParameters:
|
|
545
|
+
}, inputs: ['disabled'], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: MatFormFieldControl, useExisting: MtxSelect }], standalone: true, imports: [NgSelectModule, FormsModule, NgTemplateOutlet], template: "<ng-select #ngSelect\n [class.ng-select-invalid]=\"errorState\"\n [(ngModel)]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n [placeholder]=\"placeholder\"\n [items]=\"items\"\n [addTag]=\"addTag\"\n [addTagText]=\"addTagText\"\n [appendTo]=\"appendTo\"\n [appearance]=\"appearance\"\n [bindLabel]=\"bindLabel!\"\n [bindValue]=\"bindValue!\"\n [closeOnSelect]=\"closeOnSelect\"\n [clearAllText]=\"clearAllText\"\n [clearable]=\"clearable\"\n [clearOnBackspace]=\"clearOnBackspace\"\n [dropdownPosition]=\"dropdownPosition\"\n [groupBy]=\"groupBy\"\n [groupValue]=\"groupValue\"\n [hideSelected]=\"hideSelected\"\n [isOpen]=\"isOpen\"\n [inputAttrs]=\"inputAttrs\"\n [loading]=\"loading\"\n [loadingText]=\"loadingText\"\n [labelForId]=\"labelForId\"\n [markFirst]=\"markFirst\"\n [maxSelectedItems]=\"maxSelectedItems\"\n [multiple]=\"multiple\"\n [notFoundText]=\"notFoundText\"\n [readonly]=\"readonly\"\n [typeahead]=\"typeahead\"\n [typeToSearchText]=\"typeToSearchText\"\n [trackByFn]=\"trackByFn\"\n [searchable]=\"searchable\"\n [searchFn]=\"searchFn\"\n [searchWhileComposing]=\"searchWhileComposing\"\n [clearSearchOnAdd]=\"clearSearchOnAdd\"\n [selectableGroup]=\"selectableGroup\"\n [selectableGroupAsModel]=\"selectableGroupAsModel\"\n [selectOnTab]=\"selectOnTab\"\n [tabIndex]=\"tabIndex\"\n [openOnEnter]=\"openOnEnter\"\n [minTermLength]=\"minTermLength\"\n [editableSearchTerm]=\"editableSearchTerm\"\n [keyDownFn]=\"keyDownFn\"\n [virtualScroll]=\"virtualScroll\"\n (blur)=\"blurEvent.emit($event)\"\n (focus)=\"focusEvent.emit($event)\"\n (change)=\"changeEvent.emit($event)\"\n (open)=\"openChange()\"\n (close)=\"closeEvent.emit()\"\n (search)=\"searchEvent.emit($event)\"\n (clear)=\"clearEvent.emit($event)\"\n (add)=\"addEvent.emit($event)\"\n (remove)=\"removeEvent.emit($event)\"\n (scroll)=\"scroll.emit($event)\"\n (scrollToEnd)=\"scrollToEnd.emit()\">\n\n @if (optionTemplate) {\n <ng-template ng-option-tmp let-item=\"item\" let-item$=\"item$\" let-index=\"index\"\n let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"optionTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, item$: item$, index: index, searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n }\n\n @if (optgroupTemplate) {\n <ng-template ng-optgroup-tmp let-item=\"item\" let-item$=\"item$\" let-index=\"index\"\n let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"optgroupTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, item$: item$, index: index, searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n }\n\n @if (labelTemplate) {\n <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\" let-label=\"label\">\n <ng-template [ngTemplateOutlet]=\"labelTemplate\"\n [ngTemplateOutletContext]=\"{ item: item, clear: clear, label: label }\">\n </ng-template>\n </ng-template>\n }\n\n @if (multiLabelTemplate) {\n <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\">\n <ng-template [ngTemplateOutlet]=\"multiLabelTemplate\"\n [ngTemplateOutletContext]=\"{ items: items, clear: clear }\">\n </ng-template>\n </ng-template>\n }\n\n @if (headerTemplate) {\n <ng-template ng-header-tmp>\n <ng-template [ngTemplateOutlet]=\"headerTemplate\"></ng-template>\n </ng-template>\n }\n\n @if (footerTemplate) {\n <ng-template ng-footer-tmp>\n <ng-template [ngTemplateOutlet]=\"footerTemplate\"></ng-template>\n </ng-template>\n }\n\n @if (notFoundTemplate) {\n <ng-template ng-notfound-tmp let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"notFoundTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n }\n\n @if (typeToSearchTemplate) {\n <ng-template ng-typetosearch-tmp>\n <ng-template [ngTemplateOutlet]=\"typeToSearchTemplate\"></ng-template>\n </ng-template>\n }\n\n @if (loadingTextTemplate) {\n <ng-template ng-loadingtext-tmp let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"loadingTextTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n }\n\n @if (tagTemplate) {\n <ng-template ng-tag-tmp let-searchTerm=\"searchTerm\">\n <ng-template [ngTemplateOutlet]=\"tagTemplate\"\n [ngTemplateOutletContext]=\"{ searchTerm: searchTerm }\">\n </ng-template>\n </ng-template>\n }\n\n @if (loadingSpinnerTemplate) {\n <ng-template ng-loadingspinner-tmp>\n <ng-template [ngTemplateOutlet]=\"loadingSpinnerTemplate\"></ng-template>\n </ng-template>\n }\n\n</ng-select>\n", styles: [".ng-select{padding:var(--mat-form-field-filled-with-label-container-padding-top) 16px var(--mat-form-field-filled-with-label-container-padding-bottom);margin:calc(var(--mat-form-field-filled-with-label-container-padding-top) * -1) -16px calc(var(--mat-form-field-filled-with-label-container-padding-bottom) * -1)}.mdc-text-field--outlined .ng-select,.mdc-text-field--no-label .ng-select{padding-top:var(--mat-form-field-container-vertical-padding);padding-bottom:var(--mat-form-field-container-vertical-padding);margin-top:calc(var(--mat-form-field-container-vertical-padding) * -1);margin-bottom:calc(var(--mat-form-field-container-vertical-padding) * -1)}.ng-select .ng-select-container{align-items:center;color:var(--mtx-select-container-text-color)}.ng-select .ng-select-container .ng-value-container{align-items:center}.ng-select .ng-select-container .ng-value-container .ng-input>input{padding:0;color:inherit;font:inherit}.ng-select .ng-select-container .ng-clear-wrapper{width:24px;text-align:center}.ng-select .ng-placeholder{transition:opacity .2s;opacity:1;color:var(--mtx-select-placeholder-text-color)}.mat-form-field-hide-placeholder .ng-select .ng-placeholder{opacity:0}.ng-select .ng-has-value .ng-placeholder{display:none}.ng-select .ng-clear-wrapper{color:var(--mtx-select-clear-icon-color)}.ng-select .ng-clear-wrapper:hover .ng-clear{color:var(--mtx-select-clear-icon-hover-color)}.ng-select.ng-select-disabled .ng-value{color:var(--mtx-select-disabled-text-color)}.ng-select.ng-select-opened .ng-arrow-wrapper .ng-arrow{top:-2px;border-width:0 5px 5px}.ng-select.ng-select-single.ng-select-filtered .ng-placeholder{display:initial;visibility:hidden}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin:2px 4px 2px 0;border-radius:16px;font-size:.875em;line-height:18px;background-color:var(--mtx-select-multiple-value-background-color);border:1px solid var(--mtx-select-multiple-value-border-color)}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{margin-right:auto;margin-left:4px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value.ng-value-disabled{opacity:.4}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-label{display:inline-block;margin:0 8px}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon{display:inline-block;width:18px;height:18px;border-radius:100%;text-align:center}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{margin-right:-4px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.left{margin-left:-4px;margin-right:auto}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{margin-left:-4px}[dir=rtl] .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon.right{margin-right:-4px;margin-left:auto}.ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value .ng-value-icon:hover{background-color:var(--mtx-select-multiple-value-icon-hover-background-color)}.ng-select .ng-arrow-wrapper{width:10px}.ng-select .ng-arrow{border-width:5px 5px 2px;border-style:solid;border-color:var(--mtx-select-enabled-arrow-color) transparent transparent}.ng-select.ng-select-disabled .ng-arrow{border-color:var(--mtx-select-disabled-arrow-color) transparent transparent}.ng-select.ng-select-invalid .ng-arrow{border-color:var(--mtx-select-invalid-arrow-color) transparent transparent}.ng-select.ng-select-opened .ng-arrow{border-color:transparent transparent var(--mtx-select-enabled-arrow-color)}.ng-select.ng-select-opened.ng-select-invalid .ng-arrow{border-color:transparent transparent var(--mtx-select-invalid-arrow-color)}.ng-dropdown-panel{background-color:var(--mtx-select-panel-background-color)}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-left-radius:var(--mtx-select-container-shape);border-bottom-right-radius:var(--mtx-select-container-shape);box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-left-radius:var(--mtx-select-container-shape);border-top-right-radius:var(--mtx-select-container-shape);box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.ng-dropdown-panel .ng-dropdown-header,.ng-dropdown-panel .ng-dropdown-footer{padding:14px 16px}.ng-dropdown-panel .ng-dropdown-header{border-bottom:1px solid var(--mtx-select-panel-divider-color)}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid var(--mtx-select-panel-divider-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup{padding:14px 16px;font-weight:500;-webkit-user-select:none;user-select:none;cursor:pointer;color:var(--mtx-select-optgroup-label-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-disabled{cursor:default}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-marked{background-color:var(--mtx-select-option-hover-state-background-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected{background-color:var(--mtx-select-option-selected-state-background-color);color:var(--mtx-select-option-selected-state-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option{position:relative;padding:14px 16px;text-overflow:ellipsis;text-decoration:none;text-align:left;white-space:nowrap;overflow:hidden;color:var(--mtx-select-option-label-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:var(--mtx-select-option-hover-state-background-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{background-color:var(--mtx-select-option-selected-state-background-color);color:var(--mtx-select-option-selected-state-text-color)}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:var(--mtx-select-option-disabled-state-text-color)}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{text-align:right}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-left:32px}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-child{padding-right:32px;padding-left:0}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{margin-right:6px;font-size:80%}[dir=rtl] .ng-dropdown-panel .ng-dropdown-panel-items .ng-option .ng-tag-label{margin-left:6px;margin-right:0}\n"] }]
|
|
546
|
+
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i1.FocusMonitor }, { type: i2.ErrorStateMatcher }, { type: i3.NgForm, decorators: [{
|
|
553
547
|
type: Optional
|
|
554
548
|
}] }, { type: i3.FormGroupDirective, decorators: [{
|
|
555
549
|
type: Optional
|
|
@@ -557,7 +551,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
|
|
|
557
551
|
type: Optional
|
|
558
552
|
}, {
|
|
559
553
|
type: Self
|
|
560
|
-
}] }, { type:
|
|
554
|
+
}] }, { type: i5.MatFormField, decorators: [{
|
|
561
555
|
type: Optional
|
|
562
556
|
}, {
|
|
563
557
|
type: Inject,
|
|
@@ -567,7 +561,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
|
|
|
567
561
|
}, {
|
|
568
562
|
type: Inject,
|
|
569
563
|
args: [MTX_SELECT_DEFAULT_OPTIONS]
|
|
570
|
-
}] }]
|
|
564
|
+
}] }], propDecorators: { ngSelect: [{
|
|
571
565
|
type: ViewChild,
|
|
572
566
|
args: ['ngSelect', { static: true }]
|
|
573
567
|
}], optionTemplate: [{
|
|
@@ -730,7 +724,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
|
|
|
730
724
|
}], placeholder: [{
|
|
731
725
|
type: Input
|
|
732
726
|
}], required: [{
|
|
733
|
-
type: Input
|
|
727
|
+
type: Input,
|
|
728
|
+
args: [{ transform: booleanAttribute }]
|
|
734
729
|
}], errorStateMatcher: [{
|
|
735
730
|
type: Input
|
|
736
731
|
}], ariaLabel: [{
|
|
@@ -742,8 +737,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
|
|
|
742
737
|
}] } });
|
|
743
738
|
|
|
744
739
|
class MtxSelectModule {
|
|
745
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
746
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
740
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
741
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectModule, imports: [CommonModule,
|
|
742
|
+
FormsModule,
|
|
743
|
+
ReactiveFormsModule,
|
|
744
|
+
NgSelectModule,
|
|
745
|
+
MtxSelect,
|
|
747
746
|
MtxOption,
|
|
748
747
|
MtxSelectOptgroupTemplate,
|
|
749
748
|
MtxSelectOptionTemplate,
|
|
@@ -755,7 +754,7 @@ class MtxSelectModule {
|
|
|
755
754
|
MtxSelectTypeToSearchTemplate,
|
|
756
755
|
MtxSelectLoadingTextTemplate,
|
|
757
756
|
MtxSelectTagTemplate,
|
|
758
|
-
MtxSelectLoadingSpinnerTemplate],
|
|
757
|
+
MtxSelectLoadingSpinnerTemplate], exports: [MtxSelect,
|
|
759
758
|
MtxOption,
|
|
760
759
|
MtxSelectOptgroupTemplate,
|
|
761
760
|
MtxSelectOptionTemplate,
|
|
@@ -768,13 +767,20 @@ class MtxSelectModule {
|
|
|
768
767
|
MtxSelectLoadingTextTemplate,
|
|
769
768
|
MtxSelectTagTemplate,
|
|
770
769
|
MtxSelectLoadingSpinnerTemplate] }); }
|
|
771
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
770
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectModule, imports: [CommonModule,
|
|
771
|
+
FormsModule,
|
|
772
|
+
ReactiveFormsModule,
|
|
773
|
+
NgSelectModule,
|
|
774
|
+
MtxSelect] }); }
|
|
772
775
|
}
|
|
773
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
776
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxSelectModule, decorators: [{
|
|
774
777
|
type: NgModule,
|
|
775
778
|
args: [{
|
|
776
|
-
imports: [
|
|
777
|
-
|
|
779
|
+
imports: [
|
|
780
|
+
CommonModule,
|
|
781
|
+
FormsModule,
|
|
782
|
+
ReactiveFormsModule,
|
|
783
|
+
NgSelectModule,
|
|
778
784
|
MtxSelect,
|
|
779
785
|
MtxOption,
|
|
780
786
|
MtxSelectOptgroupTemplate,
|
|
@@ -789,7 +795,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
|
|
|
789
795
|
MtxSelectTagTemplate,
|
|
790
796
|
MtxSelectLoadingSpinnerTemplate,
|
|
791
797
|
],
|
|
792
|
-
|
|
798
|
+
exports: [
|
|
793
799
|
MtxSelect,
|
|
794
800
|
MtxOption,
|
|
795
801
|
MtxSelectOptgroupTemplate,
|