@ng-matero/extensions 18.4.1 → 19.0.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 +3 -1
- package/alert/_alert-theme.scss +19 -8
- package/alert/alert.d.ts +1 -2
- package/button/button-loading.d.ts +1 -2
- package/checkbox-group/checkbox-group.d.ts +12 -4
- package/colorpicker/_colorpicker-theme.scss +19 -8
- package/colorpicker/colorpicker-input.d.ts +1 -3
- package/colorpicker/colorpicker-toggle.d.ts +3 -3
- package/colorpicker/colorpicker.d.ts +4 -7
- package/column-resize/column-resize-directives/column-resize-flex.d.ts +2 -1
- package/column-resize/column-resize-directives/column-resize.d.ts +2 -1
- package/column-resize/column-resize-notifier.d.ts +0 -1
- package/column-resize/column-resize.d.ts +1 -1
- package/column-resize/event-dispatcher.d.ts +0 -9
- package/column-resize/overlay-handle.d.ts +1 -1
- package/column-resize/resizable.d.ts +1 -1
- package/column-resize/resize-strategy.d.ts +4 -4
- package/core/datetime/datetime-adapter.d.ts +1 -2
- package/core/datetime/native-datetime-adapter.d.ts +3 -3
- package/core/style/_button-common.scss +18 -0
- package/core/theming/_config-validation.scss +4 -4
- package/core/theming/_definition.scss +12 -2
- package/core/theming/prebuilt/azure-blue.scss +10 -22
- package/core/theming/prebuilt/cyan-orange.scss +10 -22
- package/core/theming/prebuilt/magenta-violet.scss +10 -22
- package/core/theming/prebuilt/rose-red.scss +10 -22
- package/core/tokens/_m3-system.scss +273 -0
- package/core/tokens/_m3-tokens.scss +8 -151
- package/core/tokens/_token-utils.scss +102 -43
- package/core/tokens/m2/_index.scss +2 -0
- package/core/tokens/m3/definitions/_index.scss +1 -0
- package/core/tokens/m3/definitions/_md-comp-plain-tooltip.scss +51 -0
- package/core/tokens/m3/index.scss +2 -0
- package/core/tokens/m3/mdc/_plain-tooltip.scss +15 -0
- package/core/tokens/m3/mtx/_alert.scss +14 -14
- package/core/tokens/m3/mtx/_colorpicker.scss +2 -2
- package/core/tokens/m3/mtx/_datetimepicker.scss +2 -2
- package/core/tokens/m3/mtx/_drawer.scss +2 -2
- package/core/tokens/m3/mtx/_grid.scss +2 -2
- package/core/tokens/m3/mtx/_loader.scss +2 -2
- package/core/tokens/m3/mtx/_popover.scss +2 -2
- package/core/tokens/m3/mtx/_progress.scss +2 -2
- package/core/tokens/m3/mtx/_select.scss +2 -2
- package/core/tokens/m3/mtx/_split.scss +2 -2
- package/datetimepicker/_datetimepicker-theme.scss +23 -10
- package/datetimepicker/calendar-body.d.ts +26 -4
- package/datetimepicker/calendar-body.scss +58 -9
- package/datetimepicker/calendar.d.ts +31 -31
- package/datetimepicker/clock.d.ts +11 -5
- package/datetimepicker/datetimepicker-actions.d.ts +9 -5
- package/datetimepicker/datetimepicker-content.scss +15 -0
- package/datetimepicker/datetimepicker-input.d.ts +4 -5
- package/datetimepicker/datetimepicker-module.d.ts +2 -2
- package/datetimepicker/datetimepicker-toggle.d.ts +4 -3
- package/datetimepicker/datetimepicker.d.ts +12 -8
- package/datetimepicker/month-view.d.ts +22 -7
- package/datetimepicker/multi-year-view.d.ts +20 -20
- package/datetimepicker/public-api.d.ts +2 -2
- package/datetimepicker/{time.d.ts → time-view.d.ts} +21 -9
- package/datetimepicker/{time.scss → time-view.scss} +1 -1
- package/datetimepicker/year-view.d.ts +21 -11
- package/dialog/dialog-container.d.ts +1 -2
- package/dialog/dialog.d.ts +0 -1
- package/drawer/_drawer-theme.scss +19 -8
- package/drawer/drawer-container.d.ts +2 -5
- package/drawer/drawer.d.ts +3 -5
- package/fesm2022/mtxAlert.mjs +15 -15
- package/fesm2022/mtxAlert.mjs.map +1 -1
- package/fesm2022/mtxButton.mjs +13 -14
- package/fesm2022/mtxButton.mjs.map +1 -1
- package/fesm2022/mtxCheckboxGroup.mjs +51 -31
- package/fesm2022/mtxCheckboxGroup.mjs.map +1 -1
- package/fesm2022/mtxColorpicker.mjs +91 -109
- package/fesm2022/mtxColorpicker.mjs.map +1 -1
- package/fesm2022/mtxColumnResize.mjs +79 -96
- package/fesm2022/mtxColumnResize.mjs.map +1 -1
- package/fesm2022/mtxCore.mjs +31 -36
- package/fesm2022/mtxCore.mjs.map +1 -1
- package/fesm2022/mtxDatetimepicker.mjs +1179 -1092
- package/fesm2022/mtxDatetimepicker.mjs.map +1 -1
- package/fesm2022/mtxDialog.mjs +30 -41
- package/fesm2022/mtxDialog.mjs.map +1 -1
- package/fesm2022/mtxDrawer.mjs +36 -52
- package/fesm2022/mtxDrawer.mjs.map +1 -1
- package/fesm2022/mtxGrid.mjs +168 -204
- package/fesm2022/mtxGrid.mjs.map +1 -1
- package/fesm2022/mtxLoader.mjs +12 -12
- package/fesm2022/mtxLoader.mjs.map +1 -1
- package/fesm2022/mtxPhotoviewer.mjs +11 -12
- package/fesm2022/mtxPhotoviewer.mjs.map +1 -1
- package/fesm2022/mtxPopover.mjs +106 -119
- package/fesm2022/mtxPopover.mjs.map +1 -1
- package/fesm2022/mtxProgress.mjs +8 -8
- package/fesm2022/mtxProgress.mjs.map +1 -1
- package/fesm2022/mtxSelect.mjs +157 -169
- package/fesm2022/mtxSelect.mjs.map +1 -1
- package/fesm2022/mtxSplit.mjs +39 -40
- package/fesm2022/mtxSplit.mjs.map +1 -1
- package/fesm2022/mtxTooltip.mjs +105 -91
- package/fesm2022/mtxTooltip.mjs.map +1 -1
- package/grid/_grid-theme.scss +23 -10
- package/grid/cell.d.ts +1 -4
- package/grid/column-resize/column-resize-directives/column-resize-flex.d.ts +0 -1
- package/grid/column-resize/column-resize-directives/column-resize.d.ts +0 -1
- package/grid/column-resize/overlay-handle.d.ts +1 -2
- package/grid/column-resize/resizable-directives/resizable.d.ts +2 -3
- package/grid/column-resize/resize-strategy.d.ts +2 -4
- package/grid/grid-pipes.d.ts +0 -2
- package/grid/grid.d.ts +5 -5
- package/loader/_loader-theme.scss +19 -8
- package/loader/loader.d.ts +0 -2
- package/package.json +11 -47
- package/photoviewer/photoviewer.d.ts +1 -2
- package/popover/_popover-theme.scss +19 -8
- package/popover/popover-content.d.ts +1 -1
- package/popover/popover-target.d.ts +1 -2
- package/popover/popover-trigger.d.ts +5 -6
- package/popover/popover.d.ts +1 -2
- package/prebuilt-themes/azure-blue.css +1 -1
- package/prebuilt-themes/cyan-orange.css +1 -1
- package/prebuilt-themes/deeppurple-amber.css +1 -1
- package/prebuilt-themes/indigo-pink.css +1 -1
- package/prebuilt-themes/magenta-violet.css +1 -1
- package/prebuilt-themes/pink-bluegrey.css +1 -1
- package/prebuilt-themes/purple-green.css +1 -1
- package/prebuilt-themes/rose-red.css +1 -1
- package/progress/_progress-theme.scss +23 -10
- package/select/_select-theme.scss +23 -10
- package/select/option.d.ts +0 -1
- package/select/select-intl.d.ts +2 -4
- package/select/select.d.ts +8 -7
- package/select/select.scss +3 -3
- package/select/templates.d.ts +0 -12
- package/split/_split-theme.scss +19 -8
- package/split/split-pane.d.ts +3 -4
- package/split/split.d.ts +4 -4
- package/split/split.scss +1 -1
- package/tooltip/_tooltip-theme.scss +11 -4
- package/tooltip/tooltip.d.ts +17 -9
- package/tooltip/tooltip.scss +8 -3
- package/esm2022/alert/alert-module.mjs +0 -17
- package/esm2022/alert/alert.mjs +0 -46
- package/esm2022/alert/mtxAlert.mjs +0 -5
- package/esm2022/alert/public-api.mjs +0 -3
- package/esm2022/button/button-loading.mjs +0 -66
- package/esm2022/button/button-module.mjs +0 -19
- package/esm2022/button/mtxButton.mjs +0 -5
- package/esm2022/button/public-api.mjs +0 -3
- package/esm2022/checkbox-group/checkbox-group-module.mjs +0 -20
- package/esm2022/checkbox-group/checkbox-group.mjs +0 -222
- package/esm2022/checkbox-group/interfaces.mjs +0 -2
- package/esm2022/checkbox-group/mtxCheckboxGroup.mjs +0 -5
- package/esm2022/checkbox-group/public-api.mjs +0 -4
- package/esm2022/colorpicker/colorpicker-animations.mjs +0 -16
- package/esm2022/colorpicker/colorpicker-input.mjs +0 -228
- package/esm2022/colorpicker/colorpicker-module.mjs +0 -64
- package/esm2022/colorpicker/colorpicker-toggle.mjs +0 -102
- package/esm2022/colorpicker/colorpicker.mjs +0 -363
- package/esm2022/colorpicker/mtxColorpicker.mjs +0 -5
- package/esm2022/colorpicker/public-api.mjs +0 -6
- package/esm2022/column-resize/column-resize-directives/column-resize-flex.mjs +0 -40
- package/esm2022/column-resize/column-resize-directives/column-resize.mjs +0 -40
- package/esm2022/column-resize/column-resize-directives/constants.mjs +0 -21
- package/esm2022/column-resize/column-resize-module.mjs +0 -28
- package/esm2022/column-resize/column-resize-notifier.mjs +0 -52
- package/esm2022/column-resize/column-resize.mjs +0 -82
- package/esm2022/column-resize/column-size-store.mjs +0 -20
- package/esm2022/column-resize/event-dispatcher.mjs +0 -70
- package/esm2022/column-resize/mtxColumnResize.mjs +0 -5
- package/esm2022/column-resize/overlay-handle.mjs +0 -146
- package/esm2022/column-resize/polyfill.mjs +0 -19
- package/esm2022/column-resize/public-api.mjs +0 -13
- package/esm2022/column-resize/resizable.mjs +0 -199
- package/esm2022/column-resize/resize-ref.mjs +0 -17
- package/esm2022/column-resize/resize-strategy.mjs +0 -238
- package/esm2022/column-resize/selectors.mjs +0 -13
- package/esm2022/core/datetime/datetime-adapter.mjs +0 -132
- package/esm2022/core/datetime/datetime-formats.mjs +0 -3
- package/esm2022/core/datetime/datetime.module.mjs +0 -38
- package/esm2022/core/datetime/index.mjs +0 -6
- package/esm2022/core/datetime/native-datetime-adapter.mjs +0 -138
- package/esm2022/core/datetime/native-datetime-formats.mjs +0 -20
- package/esm2022/core/mtxCore.mjs +0 -5
- package/esm2022/core/pipes/index.mjs +0 -4
- package/esm2022/core/pipes/is-template-ref.pipe.mjs +0 -14
- package/esm2022/core/pipes/pipes.module.mjs +0 -18
- package/esm2022/core/pipes/to-observable.pipe.mjs +0 -15
- package/esm2022/core/public-api.mjs +0 -3
- package/esm2022/datetimepicker/calendar-body.mjs +0 -77
- package/esm2022/datetimepicker/calendar.mjs +0 -661
- package/esm2022/datetimepicker/clock.mjs +0 -362
- package/esm2022/datetimepicker/datetimepicker-actions.mjs +0 -88
- package/esm2022/datetimepicker/datetimepicker-animations.mjs +0 -44
- package/esm2022/datetimepicker/datetimepicker-errors.mjs +0 -8
- package/esm2022/datetimepicker/datetimepicker-filtertype.mjs +0 -7
- package/esm2022/datetimepicker/datetimepicker-input.mjs +0 -349
- package/esm2022/datetimepicker/datetimepicker-intl.mjs +0 -63
- package/esm2022/datetimepicker/datetimepicker-module.mjs +0 -116
- package/esm2022/datetimepicker/datetimepicker-toggle.mjs +0 -105
- package/esm2022/datetimepicker/datetimepicker-types.mjs +0 -2
- package/esm2022/datetimepicker/datetimepicker.mjs +0 -580
- package/esm2022/datetimepicker/month-view.mjs +0 -148
- package/esm2022/datetimepicker/mtxDatetimepicker.mjs +0 -5
- package/esm2022/datetimepicker/multi-year-view.mjs +0 -215
- package/esm2022/datetimepicker/public-api.mjs +0 -17
- package/esm2022/datetimepicker/time.mjs +0 -470
- package/esm2022/datetimepicker/year-view.mjs +0 -139
- package/esm2022/dialog/dialog-config.mjs +0 -2
- package/esm2022/dialog/dialog-container.mjs +0 -43
- package/esm2022/dialog/dialog-module.mjs +0 -40
- package/esm2022/dialog/dialog.mjs +0 -75
- package/esm2022/dialog/mtxDialog.mjs +0 -5
- package/esm2022/dialog/public-api.mjs +0 -5
- package/esm2022/drawer/drawer-animations.mjs +0 -18
- package/esm2022/drawer/drawer-config.mjs +0 -35
- package/esm2022/drawer/drawer-container.mjs +0 -88
- package/esm2022/drawer/drawer-module.mjs +0 -21
- package/esm2022/drawer/drawer-ref.mjs +0 -99
- package/esm2022/drawer/drawer.mjs +0 -144
- package/esm2022/drawer/mtxDrawer.mjs +0 -5
- package/esm2022/drawer/public-api.mjs +0 -7
- package/esm2022/grid/cell.mjs +0 -132
- package/esm2022/grid/column-menu.mjs +0 -133
- package/esm2022/grid/column-resize/column-resize-directives/column-resize-flex.mjs +0 -38
- package/esm2022/grid/column-resize/column-resize-directives/column-resize.mjs +0 -38
- package/esm2022/grid/column-resize/column-resize-directives/common.mjs +0 -27
- package/esm2022/grid/column-resize/column-resize-module.mjs +0 -42
- package/esm2022/grid/column-resize/index.mjs +0 -8
- package/esm2022/grid/column-resize/overlay-handle.mjs +0 -66
- package/esm2022/grid/column-resize/resizable-directives/common.mjs +0 -29
- package/esm2022/grid/column-resize/resizable-directives/resizable.mjs +0 -64
- package/esm2022/grid/column-resize/resize-strategy.mjs +0 -47
- package/esm2022/grid/expansion-toggle.mjs +0 -65
- package/esm2022/grid/grid-module.mjs +0 -151
- package/esm2022/grid/grid-pipes.mjs +0 -129
- package/esm2022/grid/grid-utils.mjs +0 -56
- package/esm2022/grid/grid.mjs +0 -644
- package/esm2022/grid/interfaces.mjs +0 -2
- package/esm2022/grid/mtxGrid.mjs +0 -5
- package/esm2022/grid/public-api.mjs +0 -18
- package/esm2022/grid/selectable-cell.mjs +0 -53
- package/esm2022/loader/loader-module.mjs +0 -19
- package/esm2022/loader/loader.mjs +0 -57
- package/esm2022/loader/mtxLoader.mjs +0 -5
- package/esm2022/loader/public-api.mjs +0 -3
- package/esm2022/ng-matero-extensions.mjs +0 -5
- package/esm2022/photoviewer/mtxPhotoviewer.mjs +0 -5
- package/esm2022/photoviewer/photoviewer-module.mjs +0 -16
- package/esm2022/photoviewer/photoviewer.mjs +0 -64
- package/esm2022/photoviewer/public-api.mjs +0 -3
- package/esm2022/popover/mtxPopover.mjs +0 -5
- package/esm2022/popover/popover-animations.mjs +0 -25
- package/esm2022/popover/popover-content.mjs +0 -91
- package/esm2022/popover/popover-errors.mjs +0 -27
- package/esm2022/popover/popover-interfaces.mjs +0 -2
- package/esm2022/popover/popover-module.mjs +0 -39
- package/esm2022/popover/popover-target.mjs +0 -18
- package/esm2022/popover/popover-trigger.mjs +0 -480
- package/esm2022/popover/popover-types.mjs +0 -2
- package/esm2022/popover/popover.mjs +0 -325
- package/esm2022/popover/public-api.mjs +0 -9
- package/esm2022/progress/mtxProgress.mjs +0 -5
- package/esm2022/progress/progress-module.mjs +0 -17
- package/esm2022/progress/progress.mjs +0 -43
- package/esm2022/progress/public-api.mjs +0 -3
- package/esm2022/public-api.mjs +0 -5
- package/esm2022/select/mtxSelect.mjs +0 -5
- package/esm2022/select/option.mjs +0 -52
- package/esm2022/select/public-api.mjs +0 -6
- package/esm2022/select/select-intl.mjs +0 -32
- package/esm2022/select/select-module.mjs +0 -89
- package/esm2022/select/select.mjs +0 -611
- package/esm2022/select/templates.mjs +0 -135
- package/esm2022/split/interfaces.mjs +0 -2
- package/esm2022/split/mtxSplit.mjs +0 -5
- package/esm2022/split/public-api.mjs +0 -6
- package/esm2022/split/split-module.mjs +0 -18
- package/esm2022/split/split-pane.mjs +0 -161
- package/esm2022/split/split.mjs +0 -634
- package/esm2022/split/utils.mjs +0 -219
- package/esm2022/tooltip/mtxTooltip.mjs +0 -5
- package/esm2022/tooltip/public-api.mjs +0 -4
- package/esm2022/tooltip/tooltip-animations.mjs +0 -17
- package/esm2022/tooltip/tooltip-module.mjs +0 -41
- package/esm2022/tooltip/tooltip.mjs +0 -915
package/fesm2022/mtxSelect.mjs
CHANGED
|
@@ -1,27 +1,25 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { booleanAttribute, Component, ChangeDetectionStrategy, Input,
|
|
3
|
-
import { NgTemplateOutlet, CommonModule } from '@angular/common';
|
|
4
|
-
import * as
|
|
5
|
-
import { Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
6
|
-
import * as
|
|
2
|
+
import { inject, ElementRef, booleanAttribute, Component, ChangeDetectionStrategy, Input, Injectable, TemplateRef, Directive, InjectionToken, ChangeDetectorRef, EventEmitter, ViewEncapsulation, ViewChild, ContentChild, ContentChildren, Output, NgModule } from '@angular/core';
|
|
3
|
+
import { DOCUMENT, NgTemplateOutlet, CommonModule } from '@angular/common';
|
|
4
|
+
import * as i2 from '@angular/forms';
|
|
5
|
+
import { Validators, NgControl, NgForm, FormGroupDirective, FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
6
|
+
import * as i1 from '@ng-select/ng-select';
|
|
7
7
|
import { NgSelectModule } from '@ng-select/ng-select';
|
|
8
|
-
import
|
|
9
|
-
import { _ErrorStateTracker } from '@angular/material/core';
|
|
10
|
-
import * as i6 from '@angular/material/form-field';
|
|
8
|
+
import { FocusMonitor } from '@angular/cdk/a11y';
|
|
9
|
+
import { ErrorStateMatcher, _ErrorStateTracker } from '@angular/material/core';
|
|
11
10
|
import { MAT_FORM_FIELD, MatFormFieldControl } from '@angular/material/form-field';
|
|
12
11
|
import { Subject, Subscription, merge } from 'rxjs';
|
|
13
12
|
import { takeUntil, startWith } from 'rxjs/operators';
|
|
14
|
-
import * as i2 from '@angular/cdk/a11y';
|
|
15
13
|
|
|
16
14
|
class MtxOption {
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
}
|
|
20
|
-
constructor(elementRef) {
|
|
21
|
-
this.elementRef = elementRef;
|
|
15
|
+
constructor() {
|
|
16
|
+
this.elementRef = inject(ElementRef);
|
|
22
17
|
this.disabled = false;
|
|
23
18
|
this.stateChange$ = new Subject();
|
|
24
19
|
}
|
|
20
|
+
get label() {
|
|
21
|
+
return (this.elementRef.nativeElement.textContent || '').trim();
|
|
22
|
+
}
|
|
25
23
|
ngOnChanges(changes) {
|
|
26
24
|
if (changes.disabled) {
|
|
27
25
|
this.stateChange$.next({
|
|
@@ -43,185 +41,185 @@ class MtxOption {
|
|
|
43
41
|
ngOnDestroy() {
|
|
44
42
|
this.stateChange$.complete();
|
|
45
43
|
}
|
|
46
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
47
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "
|
|
44
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxOption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
45
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "19.0.4", type: MtxOption, isStandalone: true, selector: "mtx-option", inputs: { value: "value", disabled: ["disabled", "disabled", booleanAttribute] }, exportAs: ["mtxOption"], usesOnChanges: true, ngImport: i0, template: `
|
|
46
|
+
<ng-content></ng-content>
|
|
47
|
+
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
48
48
|
}
|
|
49
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
49
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxOption, decorators: [{
|
|
50
50
|
type: Component,
|
|
51
51
|
args: [{
|
|
52
52
|
selector: 'mtx-option',
|
|
53
53
|
exportAs: 'mtxOption',
|
|
54
54
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
55
|
-
template:
|
|
56
|
-
|
|
55
|
+
template: `
|
|
56
|
+
<ng-content></ng-content>
|
|
57
|
+
`,
|
|
57
58
|
}]
|
|
58
|
-
}],
|
|
59
|
+
}], propDecorators: { value: [{
|
|
59
60
|
type: Input
|
|
60
61
|
}], disabled: [{
|
|
61
62
|
type: Input,
|
|
62
63
|
args: [{ transform: booleanAttribute }]
|
|
63
64
|
}] } });
|
|
64
65
|
|
|
66
|
+
class MtxSelectIntl {
|
|
67
|
+
constructor() {
|
|
68
|
+
this._defaultOptions = inject(MTX_SELECT_DEFAULT_OPTIONS, {
|
|
69
|
+
optional: true,
|
|
70
|
+
});
|
|
71
|
+
/**
|
|
72
|
+
* Stream to emit from when labels are changed. Use this to notify components when the labels have
|
|
73
|
+
* changed after initialization.
|
|
74
|
+
*/
|
|
75
|
+
this.changes = new Subject();
|
|
76
|
+
this.placeholder = this._defaultOptions?.placeholder;
|
|
77
|
+
this.notFoundText = this._defaultOptions?.notFoundText ?? 'No items found';
|
|
78
|
+
this.typeToSearchText = this._defaultOptions?.typeToSearchText ?? 'Type to search';
|
|
79
|
+
this.addTagText = this._defaultOptions?.addTagText ?? 'Add item';
|
|
80
|
+
this.loadingText = this._defaultOptions?.loadingText ?? 'Loading...';
|
|
81
|
+
this.clearAllText = this._defaultOptions?.clearAllText ?? 'Clear all';
|
|
82
|
+
}
|
|
83
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectIntl, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
84
|
+
/** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectIntl, providedIn: 'root' }); }
|
|
85
|
+
}
|
|
86
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectIntl, decorators: [{
|
|
87
|
+
type: Injectable,
|
|
88
|
+
args: [{ providedIn: 'root' }]
|
|
89
|
+
}] });
|
|
90
|
+
|
|
65
91
|
class MtxSelectOptionTemplate {
|
|
66
|
-
constructor(
|
|
67
|
-
this.template =
|
|
92
|
+
constructor() {
|
|
93
|
+
this.template = inject(TemplateRef);
|
|
68
94
|
}
|
|
69
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
70
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
95
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectOptionTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
96
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: MtxSelectOptionTemplate, isStandalone: true, selector: "[ng-option-tmp]", ngImport: i0 }); }
|
|
71
97
|
}
|
|
72
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
98
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectOptionTemplate, decorators: [{
|
|
73
99
|
type: Directive,
|
|
74
|
-
args: [{ selector: '[ng-option-tmp]'
|
|
75
|
-
}]
|
|
100
|
+
args: [{ selector: '[ng-option-tmp]' }]
|
|
101
|
+
}] });
|
|
76
102
|
class MtxSelectOptgroupTemplate {
|
|
77
|
-
constructor(
|
|
78
|
-
this.template =
|
|
103
|
+
constructor() {
|
|
104
|
+
this.template = inject(TemplateRef);
|
|
79
105
|
}
|
|
80
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
81
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
106
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectOptgroupTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
107
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: MtxSelectOptgroupTemplate, isStandalone: true, selector: "[ng-optgroup-tmp]", ngImport: i0 }); }
|
|
82
108
|
}
|
|
83
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
109
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectOptgroupTemplate, decorators: [{
|
|
84
110
|
type: Directive,
|
|
85
|
-
args: [{ selector: '[ng-optgroup-tmp]'
|
|
86
|
-
}]
|
|
111
|
+
args: [{ selector: '[ng-optgroup-tmp]' }]
|
|
112
|
+
}] });
|
|
87
113
|
class MtxSelectLabelTemplate {
|
|
88
|
-
constructor(
|
|
89
|
-
this.template =
|
|
114
|
+
constructor() {
|
|
115
|
+
this.template = inject(TemplateRef);
|
|
90
116
|
}
|
|
91
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
92
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
117
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectLabelTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
118
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: MtxSelectLabelTemplate, isStandalone: true, selector: "[ng-label-tmp]", ngImport: i0 }); }
|
|
93
119
|
}
|
|
94
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
120
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectLabelTemplate, decorators: [{
|
|
95
121
|
type: Directive,
|
|
96
|
-
args: [{ selector: '[ng-label-tmp]'
|
|
97
|
-
}]
|
|
122
|
+
args: [{ selector: '[ng-label-tmp]' }]
|
|
123
|
+
}] });
|
|
98
124
|
class MtxSelectMultiLabelTemplate {
|
|
99
|
-
constructor(
|
|
100
|
-
this.template =
|
|
125
|
+
constructor() {
|
|
126
|
+
this.template = inject(TemplateRef);
|
|
101
127
|
}
|
|
102
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
103
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
128
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectMultiLabelTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
129
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: MtxSelectMultiLabelTemplate, isStandalone: true, selector: "[ng-multi-label-tmp]", ngImport: i0 }); }
|
|
104
130
|
}
|
|
105
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
131
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectMultiLabelTemplate, decorators: [{
|
|
106
132
|
type: Directive,
|
|
107
|
-
args: [{ selector: '[ng-multi-label-tmp]'
|
|
108
|
-
}]
|
|
133
|
+
args: [{ selector: '[ng-multi-label-tmp]' }]
|
|
134
|
+
}] });
|
|
109
135
|
class MtxSelectHeaderTemplate {
|
|
110
|
-
constructor(
|
|
111
|
-
this.template =
|
|
136
|
+
constructor() {
|
|
137
|
+
this.template = inject(TemplateRef);
|
|
112
138
|
}
|
|
113
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
114
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
139
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectHeaderTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
140
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: MtxSelectHeaderTemplate, isStandalone: true, selector: "[ng-header-tmp]", ngImport: i0 }); }
|
|
115
141
|
}
|
|
116
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
142
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectHeaderTemplate, decorators: [{
|
|
117
143
|
type: Directive,
|
|
118
|
-
args: [{ selector: '[ng-header-tmp]'
|
|
119
|
-
}]
|
|
144
|
+
args: [{ selector: '[ng-header-tmp]' }]
|
|
145
|
+
}] });
|
|
120
146
|
class MtxSelectFooterTemplate {
|
|
121
|
-
constructor(
|
|
122
|
-
this.template =
|
|
147
|
+
constructor() {
|
|
148
|
+
this.template = inject(TemplateRef);
|
|
123
149
|
}
|
|
124
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
125
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
150
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectFooterTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
151
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: MtxSelectFooterTemplate, isStandalone: true, selector: "[ng-footer-tmp]", ngImport: i0 }); }
|
|
126
152
|
}
|
|
127
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
153
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectFooterTemplate, decorators: [{
|
|
128
154
|
type: Directive,
|
|
129
|
-
args: [{ selector: '[ng-footer-tmp]'
|
|
130
|
-
}]
|
|
155
|
+
args: [{ selector: '[ng-footer-tmp]' }]
|
|
156
|
+
}] });
|
|
131
157
|
class MtxSelectNotFoundTemplate {
|
|
132
|
-
constructor(
|
|
133
|
-
this.template =
|
|
158
|
+
constructor() {
|
|
159
|
+
this.template = inject(TemplateRef);
|
|
134
160
|
}
|
|
135
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
136
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
161
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectNotFoundTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
162
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: MtxSelectNotFoundTemplate, isStandalone: true, selector: "[ng-notfound-tmp]", ngImport: i0 }); }
|
|
137
163
|
}
|
|
138
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
164
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectNotFoundTemplate, decorators: [{
|
|
139
165
|
type: Directive,
|
|
140
|
-
args: [{ selector: '[ng-notfound-tmp]'
|
|
141
|
-
}]
|
|
166
|
+
args: [{ selector: '[ng-notfound-tmp]' }]
|
|
167
|
+
}] });
|
|
142
168
|
class MtxSelectTypeToSearchTemplate {
|
|
143
|
-
constructor(
|
|
144
|
-
this.template =
|
|
169
|
+
constructor() {
|
|
170
|
+
this.template = inject(TemplateRef);
|
|
145
171
|
}
|
|
146
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
147
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
172
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectTypeToSearchTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
173
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: MtxSelectTypeToSearchTemplate, isStandalone: true, selector: "[ng-typetosearch-tmp]", ngImport: i0 }); }
|
|
148
174
|
}
|
|
149
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
175
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectTypeToSearchTemplate, decorators: [{
|
|
150
176
|
type: Directive,
|
|
151
|
-
args: [{ selector: '[ng-typetosearch-tmp]'
|
|
152
|
-
}]
|
|
177
|
+
args: [{ selector: '[ng-typetosearch-tmp]' }]
|
|
178
|
+
}] });
|
|
153
179
|
class MtxSelectLoadingTextTemplate {
|
|
154
|
-
constructor(
|
|
155
|
-
this.template =
|
|
180
|
+
constructor() {
|
|
181
|
+
this.template = inject(TemplateRef);
|
|
156
182
|
}
|
|
157
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
158
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
183
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectLoadingTextTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
184
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: MtxSelectLoadingTextTemplate, isStandalone: true, selector: "[ng-loadingtext-tmp]", ngImport: i0 }); }
|
|
159
185
|
}
|
|
160
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
186
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectLoadingTextTemplate, decorators: [{
|
|
161
187
|
type: Directive,
|
|
162
|
-
args: [{ selector: '[ng-loadingtext-tmp]'
|
|
163
|
-
}]
|
|
188
|
+
args: [{ selector: '[ng-loadingtext-tmp]' }]
|
|
189
|
+
}] });
|
|
164
190
|
class MtxSelectTagTemplate {
|
|
165
|
-
constructor(
|
|
166
|
-
this.template =
|
|
191
|
+
constructor() {
|
|
192
|
+
this.template = inject(TemplateRef);
|
|
167
193
|
}
|
|
168
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
169
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
194
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectTagTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
195
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: MtxSelectTagTemplate, isStandalone: true, selector: "[ng-tag-tmp]", ngImport: i0 }); }
|
|
170
196
|
}
|
|
171
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
197
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectTagTemplate, decorators: [{
|
|
172
198
|
type: Directive,
|
|
173
|
-
args: [{ selector: '[ng-tag-tmp]'
|
|
174
|
-
}]
|
|
199
|
+
args: [{ selector: '[ng-tag-tmp]' }]
|
|
200
|
+
}] });
|
|
175
201
|
class MtxSelectLoadingSpinnerTemplate {
|
|
176
|
-
constructor(
|
|
177
|
-
this.template =
|
|
202
|
+
constructor() {
|
|
203
|
+
this.template = inject(TemplateRef);
|
|
178
204
|
}
|
|
179
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
180
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
205
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectLoadingSpinnerTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
206
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: MtxSelectLoadingSpinnerTemplate, isStandalone: true, selector: "[ng-loadingspinner-tmp]", ngImport: i0 }); }
|
|
181
207
|
}
|
|
182
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
208
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectLoadingSpinnerTemplate, decorators: [{
|
|
183
209
|
type: Directive,
|
|
184
|
-
args: [{ selector: '[ng-loadingspinner-tmp]'
|
|
185
|
-
}]
|
|
210
|
+
args: [{ selector: '[ng-loadingspinner-tmp]' }]
|
|
211
|
+
}] });
|
|
186
212
|
class MtxSelectPlaceholderTemplate {
|
|
187
|
-
constructor(
|
|
188
|
-
this.template =
|
|
213
|
+
constructor() {
|
|
214
|
+
this.template = inject(TemplateRef);
|
|
189
215
|
}
|
|
190
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
191
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
216
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectPlaceholderTemplate, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
217
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.4", type: MtxSelectPlaceholderTemplate, isStandalone: true, selector: "[ng-placeholder-tmp]", ngImport: i0 }); }
|
|
192
218
|
}
|
|
193
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
219
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectPlaceholderTemplate, decorators: [{
|
|
194
220
|
type: Directive,
|
|
195
|
-
args: [{ selector: '[ng-placeholder-tmp]'
|
|
196
|
-
}]
|
|
197
|
-
|
|
198
|
-
class MtxSelectIntl {
|
|
199
|
-
constructor(_defaultOptions) {
|
|
200
|
-
this._defaultOptions = _defaultOptions;
|
|
201
|
-
/**
|
|
202
|
-
* Stream to emit from when labels are changed. Use this to notify components when the labels have
|
|
203
|
-
* changed after initialization.
|
|
204
|
-
*/
|
|
205
|
-
this.changes = new Subject();
|
|
206
|
-
this.placeholder = this._defaultOptions?.placeholder;
|
|
207
|
-
this.notFoundText = this._defaultOptions?.notFoundText ?? 'No items found';
|
|
208
|
-
this.typeToSearchText = this._defaultOptions?.typeToSearchText ?? 'Type to search';
|
|
209
|
-
this.addTagText = this._defaultOptions?.addTagText ?? 'Add item';
|
|
210
|
-
this.loadingText = this._defaultOptions?.loadingText ?? 'Loading...';
|
|
211
|
-
this.clearAllText = this._defaultOptions?.clearAllText ?? 'Clear all';
|
|
212
|
-
}
|
|
213
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: MtxSelectIntl, deps: [{ token: MTX_SELECT_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
214
|
-
/** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: MtxSelectIntl, providedIn: 'root' }); }
|
|
215
|
-
}
|
|
216
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: MtxSelectIntl, decorators: [{
|
|
217
|
-
type: Injectable,
|
|
218
|
-
args: [{ providedIn: 'root' }]
|
|
219
|
-
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
220
|
-
type: Optional
|
|
221
|
-
}, {
|
|
222
|
-
type: Inject,
|
|
223
|
-
args: [MTX_SELECT_DEFAULT_OPTIONS]
|
|
224
|
-
}] }] });
|
|
221
|
+
args: [{ selector: '[ng-placeholder-tmp]' }]
|
|
222
|
+
}] });
|
|
225
223
|
|
|
226
224
|
/** Injection token that can be used to specify default select options. */
|
|
227
225
|
const MTX_SELECT_DEFAULT_OPTIONS = new InjectionToken('mtx-select-default-options');
|
|
@@ -307,14 +305,17 @@ class MtxSelect {
|
|
|
307
305
|
set errorState(value) {
|
|
308
306
|
this._errorStateTracker.errorState = value;
|
|
309
307
|
}
|
|
310
|
-
constructor(
|
|
311
|
-
this._intl =
|
|
312
|
-
this._changeDetectorRef =
|
|
313
|
-
this._elementRef =
|
|
314
|
-
this._focusMonitor =
|
|
315
|
-
this.ngControl =
|
|
316
|
-
this._parentFormField =
|
|
317
|
-
this._defaultOptions =
|
|
308
|
+
constructor() {
|
|
309
|
+
this._intl = inject(MtxSelectIntl);
|
|
310
|
+
this._changeDetectorRef = inject(ChangeDetectorRef);
|
|
311
|
+
this._elementRef = inject(ElementRef);
|
|
312
|
+
this._focusMonitor = inject(FocusMonitor);
|
|
313
|
+
this.ngControl = inject(NgControl, { optional: true, self: true });
|
|
314
|
+
this._parentFormField = inject(MAT_FORM_FIELD, { optional: true });
|
|
315
|
+
this._defaultOptions = inject(MTX_SELECT_DEFAULT_OPTIONS, {
|
|
316
|
+
optional: true,
|
|
317
|
+
});
|
|
318
|
+
this._document = inject(DOCUMENT);
|
|
318
319
|
this.addTag = false;
|
|
319
320
|
this.appearance = 'underline';
|
|
320
321
|
this.appendTo = this._defaultOptions?.appendTo ?? 'body';
|
|
@@ -385,6 +386,11 @@ class MtxSelect {
|
|
|
385
386
|
/** ID for the DOM node containing the select's value. */
|
|
386
387
|
this._valueId = `mtx-select-value-${nextUniqueId++}`;
|
|
387
388
|
this._intlChangesSubscription = Subscription.EMPTY;
|
|
389
|
+
const _focusMonitor = this._focusMonitor;
|
|
390
|
+
const defaultErrorStateMatcher = inject(ErrorStateMatcher);
|
|
391
|
+
const parentForm = inject(NgForm, { optional: true });
|
|
392
|
+
const parentFormGroup = inject(FormGroupDirective, { optional: true });
|
|
393
|
+
const ngControl = this.ngControl;
|
|
388
394
|
this._intlChangesSubscription = this._intl.changes.subscribe(() => {
|
|
389
395
|
this._changeDetectorRef.detectChanges();
|
|
390
396
|
});
|
|
@@ -419,8 +425,8 @@ class MtxSelect {
|
|
|
419
425
|
}
|
|
420
426
|
}
|
|
421
427
|
ngDoCheck() {
|
|
422
|
-
const ngControl = this.ngControl;
|
|
423
428
|
if (this.ngControl) {
|
|
429
|
+
const ngControl = this.ngControl;
|
|
424
430
|
// The disabled state might go out of sync if the form group is swapped out. See #17860.
|
|
425
431
|
if (this._previousControl !== ngControl.control) {
|
|
426
432
|
if (this._previousControl !== undefined &&
|
|
@@ -566,14 +572,14 @@ class MtxSelect {
|
|
|
566
572
|
this.openEvent.emit();
|
|
567
573
|
// TODO: The ng-select has no `panelClass` prop, so we can add the theme color by the following way.
|
|
568
574
|
setTimeout(() => {
|
|
569
|
-
const dropdownEl =
|
|
575
|
+
const dropdownEl = this._document.getElementById(this.ngSelect.dropdownId);
|
|
570
576
|
dropdownEl?.classList.add('mat-' + this._parentFormField?.color);
|
|
571
577
|
});
|
|
572
578
|
}
|
|
573
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
574
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: MtxSelect, isStandalone: true, selector: "mtx-select", inputs: { addTag: "addTag", addTagText: "addTagText", appearance: "appearance", appendTo: "appendTo", bindLabel: "bindLabel", bindValue: "bindValue", closeOnSelect: ["closeOnSelect", "closeOnSelect", booleanAttribute], clearAllText: "clearAllText", clearable: ["clearable", "clearable", booleanAttribute], clearOnBackspace: ["clearOnBackspace", "clearOnBackspace", booleanAttribute], compareWith: "compareWith", dropdownPosition: "dropdownPosition", groupBy: "groupBy", groupValue: "groupValue", bufferAmount: "bufferAmount", selectableGroup: ["selectableGroup", "selectableGroup", booleanAttribute], selectableGroupAsModel: ["selectableGroupAsModel", "selectableGroupAsModel", booleanAttribute], hideSelected: ["hideSelected", "hideSelected", booleanAttribute], loading: ["loading", "loading", booleanAttribute], loadingText: "loadingText", labelForId: "labelForId", markFirst: ["markFirst", "markFirst", booleanAttribute], maxSelectedItems: "maxSelectedItems", multiple: ["multiple", "multiple", booleanAttribute], notFoundText: "notFoundText", searchable: ["searchable", "searchable", booleanAttribute], readonly: ["readonly", "readonly", booleanAttribute], searchFn: "searchFn", searchWhileComposing: ["searchWhileComposing", "searchWhileComposing", booleanAttribute], selectOnTab: ["selectOnTab", "selectOnTab", booleanAttribute], trackByFn: "trackByFn", inputAttrs: "inputAttrs", tabIndex: "tabIndex", openOnEnter: ["openOnEnter", "openOnEnter", booleanAttribute], minTermLength: "minTermLength", editableSearchTerm: ["editableSearchTerm", "editableSearchTerm", booleanAttribute], keyDownFn: "keyDownFn", virtualScroll: ["virtualScroll", "virtualScroll", booleanAttribute], typeToSearchText: "typeToSearchText", typeahead: "typeahead", isOpen: "isOpen", fixedPlaceholder: ["fixedPlaceholder", "fixedPlaceholder", booleanAttribute], deselectOnClick: ["deselectOnClick", "deselectOnClick", booleanAttribute], clearSearchOnAdd: "clearSearchOnAdd", items: "items", value: "value", id: "id", placeholder: "placeholder", disabled: ["disabled", "disabled", booleanAttribute], 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: "placeholderTemplate", first: true, predicate: MtxSelectPlaceholderTemplate, descendants: true, read: TemplateRef }, { propertyName: "mtxOptions", predicate: MtxOption, descendants: true }], viewQueries: [{ propertyName: "ngSelect", first: true, predicate: ["ngSelect"], descendants: true, static: true }], exportAs: ["mtxSelect"], ngImport: i0, template: "<ng-select #ngSelect\n [class.ng-select-invalid]=\"errorState\"\n [(ngModel)]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n [placeholder]=\"placeholder || _intl.placeholder!\"\n [items]=\"items\"\n [addTag]=\"addTag\"\n [addTagText]=\"addTagText || _intl.addTagText\"\n [appendTo]=\"appendTo\"\n [appearance]=\"appearance\"\n [bindLabel]=\"bindLabel!\"\n [bindValue]=\"bindValue!\"\n [closeOnSelect]=\"closeOnSelect\"\n [clearAllText]=\"clearAllText || _intl.clearAllText\"\n [clearable]=\"clearable\"\n [clearOnBackspace]=\"clearOnBackspace\"\n [dropdownPosition]=\"dropdownPosition\"\n [groupBy]=\"groupBy\"\n [groupValue]=\"groupValue\"\n [bufferAmount]=\"bufferAmount\"\n [hideSelected]=\"hideSelected\"\n [isOpen]=\"isOpen\"\n [inputAttrs]=\"inputAttrs\"\n [loading]=\"loading\"\n [loadingText]=\"loadingText || _intl.loadingText\"\n [labelForId]=\"labelForId\"\n [markFirst]=\"markFirst\"\n [maxSelectedItems]=\"maxSelectedItems\"\n [multiple]=\"multiple\"\n [notFoundText]=\"notFoundText || _intl.notFoundText\"\n [readonly]=\"readonly || disabled\"\n [typeahead]=\"typeahead\"\n [typeToSearchText]=\"typeToSearchText || _intl.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 [fixedPlaceholder]=\"fixedPlaceholder\"\n [deselectOnClick]=\"deselectOnClick\"\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 @if (placeholderTemplate) {\n <ng-template ng-placeholder-tmp>\n <ng-template [ngTemplateOutlet]=\"placeholderTemplate\"></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, var(--mat-app-on-surface))}.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, var(--mat-app-on-surface))}.ng-select .ng-clear-wrapper:hover .ng-clear{color:var(--mtx-select-clear-icon-hover-color, var(--mat-app-error))}.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-outline-color, var(--mat-app-outline))}[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, var(--mat-app-outline-variant))}.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, var(--mat-app-on-surface)) 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, var(--mat-app-error)) transparent transparent}.ng-select.ng-select-opened .ng-arrow{border-color:transparent transparent var(--mtx-select-enabled-arrow-color, var(--mat-app-on-surface))}.ng-select.ng-select-opened.ng-select-invalid .ng-arrow{border-color:transparent transparent var(--mtx-select-invalid-arrow-color, var(--mat-app-error))}.ng-dropdown-panel{background-color:var(--mtx-select-panel-background-color, var(--mat-app-surface-container))}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-left-radius:var(--mtx-select-container-shape, var(--mat-app-corner-extra-small));border-bottom-right-radius:var(--mtx-select-container-shape, var(--mat-app-corner-extra-small));box-shadow:var(--mtx-select-container-elevation-shadow)}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-left-radius:var(--mtx-select-container-shape, var(--mat-app-corner-extra-small));border-top-right-radius:var(--mtx-select-container-shape, var(--mat-app-corner-extra-small));box-shadow:var(--mtx-select-container-elevation-shadow)}.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, var(--mat-app-outline))}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid var(--mtx-select-panel-divider-color, var(--mat-app-outline))}.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, var(--mat-app-on-surface))}.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, var(--mat-app-secondary-container));color:var(--mtx-select-option-selected-state-text-color, var(--mat-app-on-surface))}.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, var(--mat-app-on-surface))}.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, var(--mat-app-secondary-container));color:var(--mtx-select-option-selected-state-text-color, var(--mat-app-on-surface))}.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: i5.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "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", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], 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.NgPlaceholderTemplateDirective, selector: "[ng-placeholder-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: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.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 }); }
|
|
579
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelect, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
580
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.4", type: MtxSelect, isStandalone: true, selector: "mtx-select", inputs: { addTag: "addTag", addTagText: "addTagText", appearance: "appearance", appendTo: "appendTo", bindLabel: "bindLabel", bindValue: "bindValue", closeOnSelect: ["closeOnSelect", "closeOnSelect", booleanAttribute], clearAllText: "clearAllText", clearable: ["clearable", "clearable", booleanAttribute], clearOnBackspace: ["clearOnBackspace", "clearOnBackspace", booleanAttribute], compareWith: "compareWith", dropdownPosition: "dropdownPosition", groupBy: "groupBy", groupValue: "groupValue", bufferAmount: "bufferAmount", selectableGroup: ["selectableGroup", "selectableGroup", booleanAttribute], selectableGroupAsModel: ["selectableGroupAsModel", "selectableGroupAsModel", booleanAttribute], hideSelected: ["hideSelected", "hideSelected", booleanAttribute], loading: ["loading", "loading", booleanAttribute], loadingText: "loadingText", labelForId: "labelForId", markFirst: ["markFirst", "markFirst", booleanAttribute], maxSelectedItems: "maxSelectedItems", multiple: ["multiple", "multiple", booleanAttribute], notFoundText: "notFoundText", searchable: ["searchable", "searchable", booleanAttribute], readonly: ["readonly", "readonly", booleanAttribute], searchFn: "searchFn", searchWhileComposing: ["searchWhileComposing", "searchWhileComposing", booleanAttribute], selectOnTab: ["selectOnTab", "selectOnTab", booleanAttribute], trackByFn: "trackByFn", inputAttrs: "inputAttrs", tabIndex: "tabIndex", openOnEnter: ["openOnEnter", "openOnEnter", booleanAttribute], minTermLength: "minTermLength", editableSearchTerm: ["editableSearchTerm", "editableSearchTerm", booleanAttribute], keyDownFn: "keyDownFn", virtualScroll: ["virtualScroll", "virtualScroll", booleanAttribute], typeToSearchText: "typeToSearchText", typeahead: "typeahead", isOpen: "isOpen", fixedPlaceholder: ["fixedPlaceholder", "fixedPlaceholder", booleanAttribute], deselectOnClick: ["deselectOnClick", "deselectOnClick", booleanAttribute], clearSearchOnAdd: "clearSearchOnAdd", items: "items", value: "value", id: "id", placeholder: "placeholder", disabled: ["disabled", "disabled", booleanAttribute], 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: "placeholderTemplate", first: true, predicate: MtxSelectPlaceholderTemplate, descendants: true, read: TemplateRef }, { propertyName: "mtxOptions", predicate: MtxOption, descendants: true }], viewQueries: [{ propertyName: "ngSelect", first: true, predicate: ["ngSelect"], descendants: true, static: true }], exportAs: ["mtxSelect"], ngImport: i0, template: "<ng-select #ngSelect\n [class.ng-select-invalid]=\"errorState\"\n [(ngModel)]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n [placeholder]=\"placeholder || _intl.placeholder!\"\n [items]=\"items\"\n [addTag]=\"addTag\"\n [addTagText]=\"addTagText || _intl.addTagText\"\n [appendTo]=\"appendTo\"\n [appearance]=\"appearance\"\n [bindLabel]=\"bindLabel!\"\n [bindValue]=\"bindValue!\"\n [closeOnSelect]=\"closeOnSelect\"\n [clearAllText]=\"clearAllText || _intl.clearAllText\"\n [clearable]=\"clearable\"\n [clearOnBackspace]=\"clearOnBackspace\"\n [dropdownPosition]=\"dropdownPosition\"\n [groupBy]=\"groupBy\"\n [groupValue]=\"groupValue\"\n [bufferAmount]=\"bufferAmount\"\n [hideSelected]=\"hideSelected\"\n [isOpen]=\"isOpen\"\n [inputAttrs]=\"inputAttrs\"\n [loading]=\"loading\"\n [loadingText]=\"loadingText || _intl.loadingText\"\n [labelForId]=\"labelForId\"\n [markFirst]=\"markFirst\"\n [maxSelectedItems]=\"maxSelectedItems\"\n [multiple]=\"multiple\"\n [notFoundText]=\"notFoundText || _intl.notFoundText\"\n [readonly]=\"readonly || disabled\"\n [typeahead]=\"typeahead\"\n [typeToSearchText]=\"typeToSearchText || _intl.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 [fixedPlaceholder]=\"fixedPlaceholder\"\n [deselectOnClick]=\"deselectOnClick\"\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 @if (placeholderTemplate) {\n <ng-template ng-placeholder-tmp>\n <ng-template [ngTemplateOutlet]=\"placeholderTemplate\"></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, 24px) 16px var(--mat-form-field-filled-with-label-container-padding-bottom, 8px);margin:calc(var(--mat-form-field-filled-with-label-container-padding-top, 24px) * -1) -16px calc(var(--mat-form-field-filled-with-label-container-padding-bottom, 8px) * -1)}.mdc-text-field--outlined .ng-select,.mdc-text-field--no-label .ng-select{padding-top:var(--mat-form-field-container-vertical-padding, 16px);padding-bottom:var(--mat-form-field-container-vertical-padding, 16px);margin-top:calc(var(--mat-form-field-container-vertical-padding, 16px) * -1);margin-bottom:calc(var(--mat-form-field-container-vertical-padding, 16px) * -1)}.ng-select .ng-select-container{align-items:center;color:var(--mtx-select-container-text-color, var(--mat-sys-on-surface))}.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, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.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, var(--mat-sys-on-surface))}.ng-select .ng-clear-wrapper:hover .ng-clear{color:var(--mtx-select-clear-icon-hover-color, var(--mat-sys-error))}.ng-select.ng-select-disabled .ng-value{color:var(--mtx-select-disabled-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.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, transparent);border:1px solid var(--mtx-select-multiple-value-outline-color, var(--mat-sys-outline))}[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, var(--mat-sys-outline-variant))}.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, var(--mat-sys-on-surface)) transparent transparent}.ng-select.ng-select-disabled .ng-arrow{border-color:var(--mtx-select-disabled-arrow-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent)) transparent transparent}.ng-select.ng-select-invalid .ng-arrow{border-color:var(--mtx-select-invalid-arrow-color, var(--mat-sys-error)) transparent transparent}.ng-select.ng-select-opened .ng-arrow{border-color:transparent transparent var(--mtx-select-enabled-arrow-color, var(--mat-sys-on-surface))}.ng-select.ng-select-opened.ng-select-invalid .ng-arrow{border-color:transparent transparent var(--mtx-select-invalid-arrow-color, var(--mat-sys-error))}.ng-dropdown-panel{background-color:var(--mtx-select-panel-background-color, var(--mat-sys-surface-container))}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-left-radius:var(--mtx-select-container-shape, var(--mat-sys-corner-extra-small));border-bottom-right-radius:var(--mtx-select-container-shape, var(--mat-sys-corner-extra-small));box-shadow:var(--mtx-select-container-elevation-shadow, 0px 3px 1px -2px rgba(0, 0, 0, .2), 0px 2px 2px 0px rgba(0, 0, 0, .14), 0px 1px 5px 0px rgba(0, 0, 0, .12))}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-left-radius:var(--mtx-select-container-shape, var(--mat-sys-corner-extra-small));border-top-right-radius:var(--mtx-select-container-shape, var(--mat-sys-corner-extra-small));box-shadow:var(--mtx-select-container-elevation-shadow, 0px 3px 1px -2px rgba(0, 0, 0, .2), 0px 2px 2px 0px rgba(0, 0, 0, .14), 0px 1px 5px 0px rgba(0, 0, 0, .12))}.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, var(--mat-sys-outline))}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid var(--mtx-select-panel-divider-color, var(--mat-sys-outline))}.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, var(--mat-sys-on-surface))}.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, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected{background-color:var(--mtx-select-option-selected-state-background-color, var(--mat-sys-secondary-container));color:var(--mtx-select-option-selected-state-text-color, var(--mat-sys-on-surface))}.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, var(--mat-sys-on-surface))}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:var(--mtx-select-option-hover-state-background-color, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{background-color:var(--mtx-select-option-selected-state-background-color, var(--mat-sys-secondary-container));color:var(--mtx-select-option-selected-state-text-color, var(--mat-sys-on-surface))}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:var(--mtx-select-option-disabled-state-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}[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: i1.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "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", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i1.NgOptgroupTemplateDirective, selector: "[ng-optgroup-tmp]" }, { kind: "directive", type: i1.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i1.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i1.NgMultiLabelTemplateDirective, selector: "[ng-multi-label-tmp]" }, { kind: "directive", type: i1.NgHeaderTemplateDirective, selector: "[ng-header-tmp]" }, { kind: "directive", type: i1.NgFooterTemplateDirective, selector: "[ng-footer-tmp]" }, { kind: "directive", type: i1.NgPlaceholderTemplateDirective, selector: "[ng-placeholder-tmp]" }, { kind: "directive", type: i1.NgNotFoundTemplateDirective, selector: "[ng-notfound-tmp]" }, { kind: "directive", type: i1.NgTypeToSearchTemplateDirective, selector: "[ng-typetosearch-tmp]" }, { kind: "directive", type: i1.NgLoadingTextTemplateDirective, selector: "[ng-loadingtext-tmp]" }, { kind: "directive", type: i1.NgTagTemplateDirective, selector: "[ng-tag-tmp]" }, { kind: "directive", type: i1.NgLoadingSpinnerTemplateDirective, selector: "[ng-loadingspinner-tmp]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.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 }); }
|
|
575
581
|
}
|
|
576
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
582
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelect, decorators: [{
|
|
577
583
|
type: Component,
|
|
578
584
|
args: [{ selector: 'mtx-select', exportAs: 'mtxSelect', host: {
|
|
579
585
|
'role': 'combobox',
|
|
@@ -593,26 +599,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
|
|
|
593
599
|
'[class.mtx-select-empty]': 'empty',
|
|
594
600
|
'[class.mtx-select-multiple]': 'multiple',
|
|
595
601
|
'class': 'mtx-select',
|
|
596
|
-
}, 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 || _intl.placeholder!\"\n [items]=\"items\"\n [addTag]=\"addTag\"\n [addTagText]=\"addTagText || _intl.addTagText\"\n [appendTo]=\"appendTo\"\n [appearance]=\"appearance\"\n [bindLabel]=\"bindLabel!\"\n [bindValue]=\"bindValue!\"\n [closeOnSelect]=\"closeOnSelect\"\n [clearAllText]=\"clearAllText || _intl.clearAllText\"\n [clearable]=\"clearable\"\n [clearOnBackspace]=\"clearOnBackspace\"\n [dropdownPosition]=\"dropdownPosition\"\n [groupBy]=\"groupBy\"\n [groupValue]=\"groupValue\"\n [bufferAmount]=\"bufferAmount\"\n [hideSelected]=\"hideSelected\"\n [isOpen]=\"isOpen\"\n [inputAttrs]=\"inputAttrs\"\n [loading]=\"loading\"\n [loadingText]=\"loadingText || _intl.loadingText\"\n [labelForId]=\"labelForId\"\n [markFirst]=\"markFirst\"\n [maxSelectedItems]=\"maxSelectedItems\"\n [multiple]=\"multiple\"\n [notFoundText]=\"notFoundText || _intl.notFoundText\"\n [readonly]=\"readonly || disabled\"\n [typeahead]=\"typeahead\"\n [typeToSearchText]=\"typeToSearchText || _intl.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 [fixedPlaceholder]=\"fixedPlaceholder\"\n [deselectOnClick]=\"deselectOnClick\"\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 @if (placeholderTemplate) {\n <ng-template ng-placeholder-tmp>\n <ng-template [ngTemplateOutlet]=\"placeholderTemplate\"></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, var(--mat-app-on-surface))}.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, var(--mat-app-on-surface))}.ng-select .ng-clear-wrapper:hover .ng-clear{color:var(--mtx-select-clear-icon-hover-color, var(--mat-app-error))}.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-outline-color, var(--mat-app-outline))}[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, var(--mat-app-outline-variant))}.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, var(--mat-app-on-surface)) 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, var(--mat-app-error)) transparent transparent}.ng-select.ng-select-opened .ng-arrow{border-color:transparent transparent var(--mtx-select-enabled-arrow-color, var(--mat-app-on-surface))}.ng-select.ng-select-opened.ng-select-invalid .ng-arrow{border-color:transparent transparent var(--mtx-select-invalid-arrow-color, var(--mat-app-error))}.ng-dropdown-panel{background-color:var(--mtx-select-panel-background-color, var(--mat-app-surface-container))}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-left-radius:var(--mtx-select-container-shape, var(--mat-app-corner-extra-small));border-bottom-right-radius:var(--mtx-select-container-shape, var(--mat-app-corner-extra-small));box-shadow:var(--mtx-select-container-elevation-shadow)}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-left-radius:var(--mtx-select-container-shape, var(--mat-app-corner-extra-small));border-top-right-radius:var(--mtx-select-container-shape, var(--mat-app-corner-extra-small));box-shadow:var(--mtx-select-container-elevation-shadow)}.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, var(--mat-app-outline))}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid var(--mtx-select-panel-divider-color, var(--mat-app-outline))}.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, var(--mat-app-on-surface))}.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, var(--mat-app-secondary-container));color:var(--mtx-select-option-selected-state-text-color, var(--mat-app-on-surface))}.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, var(--mat-app-on-surface))}.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, var(--mat-app-secondary-container));color:var(--mtx-select-option-selected-state-text-color, var(--mat-app-on-surface))}.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"] }]
|
|
597
|
-
}], ctorParameters: () => [
|
|
598
|
-
type: Optional
|
|
599
|
-
}] }, { type: i4.FormGroupDirective, decorators: [{
|
|
600
|
-
type: Optional
|
|
601
|
-
}] }, { type: i4.NgControl, decorators: [{
|
|
602
|
-
type: Optional
|
|
603
|
-
}, {
|
|
604
|
-
type: Self
|
|
605
|
-
}] }, { type: i6.MatFormField, decorators: [{
|
|
606
|
-
type: Optional
|
|
607
|
-
}, {
|
|
608
|
-
type: Inject,
|
|
609
|
-
args: [MAT_FORM_FIELD]
|
|
610
|
-
}] }, { type: undefined, decorators: [{
|
|
611
|
-
type: Optional
|
|
612
|
-
}, {
|
|
613
|
-
type: Inject,
|
|
614
|
-
args: [MTX_SELECT_DEFAULT_OPTIONS]
|
|
615
|
-
}] }], propDecorators: { ngSelect: [{
|
|
602
|
+
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: MatFormFieldControl, useExisting: MtxSelect }], imports: [NgSelectModule, FormsModule, NgTemplateOutlet], template: "<ng-select #ngSelect\n [class.ng-select-invalid]=\"errorState\"\n [(ngModel)]=\"value\"\n [ngModelOptions]=\"{standalone: true}\"\n [placeholder]=\"placeholder || _intl.placeholder!\"\n [items]=\"items\"\n [addTag]=\"addTag\"\n [addTagText]=\"addTagText || _intl.addTagText\"\n [appendTo]=\"appendTo\"\n [appearance]=\"appearance\"\n [bindLabel]=\"bindLabel!\"\n [bindValue]=\"bindValue!\"\n [closeOnSelect]=\"closeOnSelect\"\n [clearAllText]=\"clearAllText || _intl.clearAllText\"\n [clearable]=\"clearable\"\n [clearOnBackspace]=\"clearOnBackspace\"\n [dropdownPosition]=\"dropdownPosition\"\n [groupBy]=\"groupBy\"\n [groupValue]=\"groupValue\"\n [bufferAmount]=\"bufferAmount\"\n [hideSelected]=\"hideSelected\"\n [isOpen]=\"isOpen\"\n [inputAttrs]=\"inputAttrs\"\n [loading]=\"loading\"\n [loadingText]=\"loadingText || _intl.loadingText\"\n [labelForId]=\"labelForId\"\n [markFirst]=\"markFirst\"\n [maxSelectedItems]=\"maxSelectedItems\"\n [multiple]=\"multiple\"\n [notFoundText]=\"notFoundText || _intl.notFoundText\"\n [readonly]=\"readonly || disabled\"\n [typeahead]=\"typeahead\"\n [typeToSearchText]=\"typeToSearchText || _intl.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 [fixedPlaceholder]=\"fixedPlaceholder\"\n [deselectOnClick]=\"deselectOnClick\"\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 @if (placeholderTemplate) {\n <ng-template ng-placeholder-tmp>\n <ng-template [ngTemplateOutlet]=\"placeholderTemplate\"></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, 24px) 16px var(--mat-form-field-filled-with-label-container-padding-bottom, 8px);margin:calc(var(--mat-form-field-filled-with-label-container-padding-top, 24px) * -1) -16px calc(var(--mat-form-field-filled-with-label-container-padding-bottom, 8px) * -1)}.mdc-text-field--outlined .ng-select,.mdc-text-field--no-label .ng-select{padding-top:var(--mat-form-field-container-vertical-padding, 16px);padding-bottom:var(--mat-form-field-container-vertical-padding, 16px);margin-top:calc(var(--mat-form-field-container-vertical-padding, 16px) * -1);margin-bottom:calc(var(--mat-form-field-container-vertical-padding, 16px) * -1)}.ng-select .ng-select-container{align-items:center;color:var(--mtx-select-container-text-color, var(--mat-sys-on-surface))}.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, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.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, var(--mat-sys-on-surface))}.ng-select .ng-clear-wrapper:hover .ng-clear{color:var(--mtx-select-clear-icon-hover-color, var(--mat-sys-error))}.ng-select.ng-select-disabled .ng-value{color:var(--mtx-select-disabled-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}.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, transparent);border:1px solid var(--mtx-select-multiple-value-outline-color, var(--mat-sys-outline))}[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, var(--mat-sys-outline-variant))}.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, var(--mat-sys-on-surface)) transparent transparent}.ng-select.ng-select-disabled .ng-arrow{border-color:var(--mtx-select-disabled-arrow-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent)) transparent transparent}.ng-select.ng-select-invalid .ng-arrow{border-color:var(--mtx-select-invalid-arrow-color, var(--mat-sys-error)) transparent transparent}.ng-select.ng-select-opened .ng-arrow{border-color:transparent transparent var(--mtx-select-enabled-arrow-color, var(--mat-sys-on-surface))}.ng-select.ng-select-opened.ng-select-invalid .ng-arrow{border-color:transparent transparent var(--mtx-select-invalid-arrow-color, var(--mat-sys-error))}.ng-dropdown-panel{background-color:var(--mtx-select-panel-background-color, var(--mat-sys-surface-container))}.ng-dropdown-panel.ng-select-bottom{top:100%;border-bottom-left-radius:var(--mtx-select-container-shape, var(--mat-sys-corner-extra-small));border-bottom-right-radius:var(--mtx-select-container-shape, var(--mat-sys-corner-extra-small));box-shadow:var(--mtx-select-container-elevation-shadow, 0px 3px 1px -2px rgba(0, 0, 0, .2), 0px 2px 2px 0px rgba(0, 0, 0, .14), 0px 1px 5px 0px rgba(0, 0, 0, .12))}.ng-dropdown-panel.ng-select-top{bottom:100%;border-top-left-radius:var(--mtx-select-container-shape, var(--mat-sys-corner-extra-small));border-top-right-radius:var(--mtx-select-container-shape, var(--mat-sys-corner-extra-small));box-shadow:var(--mtx-select-container-elevation-shadow, 0px 3px 1px -2px rgba(0, 0, 0, .2), 0px 2px 2px 0px rgba(0, 0, 0, .14), 0px 1px 5px 0px rgba(0, 0, 0, .12))}.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, var(--mat-sys-outline))}.ng-dropdown-panel .ng-dropdown-footer{border-top:1px solid var(--mtx-select-panel-divider-color, var(--mat-sys-outline))}.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, var(--mat-sys-on-surface))}.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, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))}.ng-dropdown-panel .ng-dropdown-panel-items .ng-optgroup.ng-option-selected{background-color:var(--mtx-select-option-selected-state-background-color, var(--mat-sys-secondary-container));color:var(--mtx-select-option-selected-state-text-color, var(--mat-sys-on-surface))}.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, var(--mat-sys-on-surface))}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{background-color:var(--mtx-select-option-hover-state-background-color, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected{background-color:var(--mtx-select-option-selected-state-background-color, var(--mat-sys-secondary-container));color:var(--mtx-select-option-selected-state-text-color, var(--mat-sys-on-surface))}.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-disabled{color:var(--mtx-select-option-disabled-state-text-color, color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent))}[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"] }]
|
|
603
|
+
}], ctorParameters: () => [], propDecorators: { ngSelect: [{
|
|
616
604
|
type: ViewChild,
|
|
617
605
|
args: ['ngSelect', { static: true }]
|
|
618
606
|
}], optionTemplate: [{
|
|
@@ -818,8 +806,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImpor
|
|
|
818
806
|
}] } });
|
|
819
807
|
|
|
820
808
|
class MtxSelectModule {
|
|
821
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
822
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
809
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
810
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectModule, imports: [CommonModule,
|
|
823
811
|
FormsModule,
|
|
824
812
|
ReactiveFormsModule,
|
|
825
813
|
NgSelectModule,
|
|
@@ -850,13 +838,13 @@ class MtxSelectModule {
|
|
|
850
838
|
MtxSelectTagTemplate,
|
|
851
839
|
MtxSelectLoadingSpinnerTemplate,
|
|
852
840
|
MtxSelectPlaceholderTemplate] }); }
|
|
853
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
841
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectModule, imports: [CommonModule,
|
|
854
842
|
FormsModule,
|
|
855
843
|
ReactiveFormsModule,
|
|
856
844
|
NgSelectModule,
|
|
857
845
|
MtxSelect] }); }
|
|
858
846
|
}
|
|
859
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
847
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.4", ngImport: i0, type: MtxSelectModule, decorators: [{
|
|
860
848
|
type: NgModule,
|
|
861
849
|
args: [{
|
|
862
850
|
imports: [
|