@ng-matero/extensions 15.2.1 → 15.4.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 +2 -2
- package/_theming.scss +2 -2
- package/alert/alert.d.ts +1 -1
- package/checkbox-group/checkbox-group.d.ts +6 -6
- package/colorpicker/colorpicker-input.d.ts +1 -1
- package/colorpicker/colorpicker.d.ts +2 -2
- package/core/theming/_all-theme.scss +2 -2
- package/datetimepicker/clock.d.ts +1 -1
- package/datetimepicker/datetimepicker-types.d.ts +3 -3
- package/datetimepicker/datetimepicker.d.ts +3 -3
- package/drawer/drawer-config.d.ts +2 -2
- package/esm2020/alert/alert-module.mjs +4 -4
- package/esm2020/alert/alert.mjs +14 -14
- package/esm2020/button/button-loading.mjs +11 -11
- package/esm2020/button/button-module.mjs +4 -4
- package/esm2020/checkbox-group/checkbox-group-module.mjs +4 -4
- package/esm2020/checkbox-group/checkbox-group.mjs +27 -29
- package/esm2020/colorpicker/colorpicker-input.mjs +26 -26
- package/esm2020/colorpicker/colorpicker-module.mjs +4 -4
- package/esm2020/colorpicker/colorpicker-toggle.mjs +13 -13
- package/esm2020/colorpicker/colorpicker.mjs +37 -37
- package/esm2020/column-resize/column-resize-directives/column-resize-flex.mjs +3 -3
- package/esm2020/column-resize/column-resize-directives/column-resize.mjs +3 -3
- package/esm2020/column-resize/column-resize-module.mjs +4 -4
- package/esm2020/column-resize/column-resize-notifier.mjs +6 -6
- package/esm2020/column-resize/column-resize.mjs +3 -3
- package/esm2020/column-resize/column-size-store.mjs +3 -3
- package/esm2020/column-resize/event-dispatcher.mjs +3 -3
- package/esm2020/column-resize/overlay-handle.mjs +3 -3
- package/esm2020/column-resize/resizable.mjs +3 -3
- package/esm2020/column-resize/resize-strategy.mjs +9 -9
- package/esm2020/core/datetime/datetime.module.mjs +8 -8
- package/esm2020/core/datetime/native-datetime-adapter.mjs +3 -3
- package/esm2020/core/pipes/is-template-ref.pipe.mjs +3 -3
- package/esm2020/core/pipes/pipes.module.mjs +4 -4
- package/esm2020/core/pipes/to-observable.pipe.mjs +3 -3
- package/esm2020/datetimepicker/calendar-body.mjs +3 -3
- package/esm2020/datetimepicker/calendar.mjs +18 -18
- package/esm2020/datetimepicker/clock.mjs +3 -3
- package/esm2020/datetimepicker/datetimepicker-input.mjs +4 -4
- package/esm2020/datetimepicker/datetimepicker-intl.mjs +3 -3
- package/esm2020/datetimepicker/datetimepicker-module.mjs +4 -4
- package/esm2020/datetimepicker/datetimepicker-toggle.mjs +14 -14
- package/esm2020/datetimepicker/datetimepicker.mjs +46 -46
- package/esm2020/datetimepicker/month-view.mjs +3 -3
- package/esm2020/datetimepicker/multi-year-view.mjs +3 -3
- package/esm2020/datetimepicker/time.mjs +48 -48
- package/esm2020/datetimepicker/year-view.mjs +3 -3
- package/esm2020/dialog/dialog-container.mjs +3 -3
- package/esm2020/dialog/dialog-module.mjs +4 -4
- package/esm2020/dialog/dialog.mjs +3 -3
- package/esm2020/drawer/drawer-container.mjs +27 -27
- package/esm2020/drawer/drawer-module.mjs +4 -4
- package/esm2020/drawer/drawer.mjs +11 -11
- package/esm2020/grid/cell.mjs +10 -9
- package/esm2020/grid/column-menu.mjs +3 -3
- package/esm2020/grid/column-resize/column-resize-directives/column-resize-flex.mjs +3 -3
- package/esm2020/grid/column-resize/column-resize-directives/column-resize.mjs +3 -3
- package/esm2020/grid/column-resize/column-resize-module.mjs +8 -8
- package/esm2020/grid/column-resize/overlay-handle.mjs +3 -3
- package/esm2020/grid/column-resize/resizable-directives/resizable.mjs +13 -13
- package/esm2020/grid/column-resize/resize-strategy.mjs +3 -3
- package/esm2020/grid/expansion-toggle.mjs +9 -9
- package/esm2020/grid/grid-module.mjs +4 -4
- package/esm2020/grid/grid-pipes.mjs +17 -17
- package/esm2020/grid/grid-utils.mjs +3 -3
- package/esm2020/grid/grid.mjs +77 -63
- package/esm2020/grid/interfaces.mjs +1 -1
- package/esm2020/loader/loader-module.mjs +4 -4
- package/esm2020/loader/loader.mjs +18 -18
- package/esm2020/popover/popover-content.mjs +6 -6
- package/esm2020/popover/popover-module.mjs +4 -4
- package/esm2020/popover/popover-target.mjs +3 -3
- package/esm2020/popover/popover-trigger.mjs +20 -20
- package/esm2020/popover/popover.mjs +43 -43
- package/esm2020/progress/progress-module.mjs +4 -4
- package/esm2020/progress/progress.mjs +3 -3
- package/esm2020/select/option.mjs +9 -9
- package/esm2020/select/select-module.mjs +4 -4
- package/esm2020/select/select.mjs +92 -79
- package/esm2020/select/templates.mjs +33 -33
- package/esm2020/slider/slider-module.mjs +4 -4
- package/esm2020/slider/slider.mjs +147 -147
- package/esm2020/split/interfaces.mjs +1 -1
- package/esm2020/split/split-module.mjs +4 -4
- package/esm2020/split/split-pane.mjs +23 -23
- package/esm2020/split/split.mjs +65 -50
- package/esm2020/tooltip/tooltip-module.mjs +4 -4
- package/esm2020/tooltip/tooltip.mjs +70 -70
- package/fesm2015/mtxAlert.mjs +17 -17
- package/fesm2015/mtxAlert.mjs.map +1 -1
- package/fesm2015/mtxButton.mjs +14 -14
- package/fesm2015/mtxButton.mjs.map +1 -1
- package/fesm2015/mtxCheckboxGroup.mjs +28 -30
- package/fesm2015/mtxCheckboxGroup.mjs.map +1 -1
- package/fesm2015/mtxColorpicker.mjs +77 -77
- package/fesm2015/mtxColorpicker.mjs.map +1 -1
- package/fesm2015/mtxColumnResize.mjs +40 -40
- package/fesm2015/mtxCore.mjs +21 -21
- package/fesm2015/mtxDatetimepicker.mjs +147 -147
- package/fesm2015/mtxDatetimepicker.mjs.map +1 -1
- package/fesm2015/mtxDialog.mjs +10 -10
- package/fesm2015/mtxDrawer.mjs +40 -40
- package/fesm2015/mtxDrawer.mjs.map +1 -1
- package/fesm2015/mtxGrid.mjs +155 -137
- package/fesm2015/mtxGrid.mjs.map +1 -1
- package/fesm2015/mtxLoader.mjs +21 -21
- package/fesm2015/mtxLoader.mjs.map +1 -1
- package/fesm2015/mtxPopover.mjs +75 -75
- package/fesm2015/mtxPopover.mjs.map +1 -1
- package/fesm2015/mtxProgress.mjs +7 -7
- package/fesm2015/mtxSelect.mjs +139 -125
- package/fesm2015/mtxSelect.mjs.map +1 -1
- package/fesm2015/mtxSlider.mjs +150 -150
- package/fesm2015/mtxSlider.mjs.map +1 -1
- package/fesm2015/mtxSplit.mjs +94 -76
- package/fesm2015/mtxSplit.mjs.map +1 -1
- package/fesm2015/mtxTooltip.mjs +73 -73
- package/fesm2015/mtxTooltip.mjs.map +1 -1
- package/fesm2020/mtxAlert.mjs +17 -17
- package/fesm2020/mtxAlert.mjs.map +1 -1
- package/fesm2020/mtxButton.mjs +14 -14
- package/fesm2020/mtxButton.mjs.map +1 -1
- package/fesm2020/mtxCheckboxGroup.mjs +28 -30
- package/fesm2020/mtxCheckboxGroup.mjs.map +1 -1
- package/fesm2020/mtxColorpicker.mjs +77 -77
- package/fesm2020/mtxColorpicker.mjs.map +1 -1
- package/fesm2020/mtxColumnResize.mjs +40 -40
- package/fesm2020/mtxCore.mjs +21 -21
- package/fesm2020/mtxDatetimepicker.mjs +147 -147
- package/fesm2020/mtxDatetimepicker.mjs.map +1 -1
- package/fesm2020/mtxDialog.mjs +10 -10
- package/fesm2020/mtxDrawer.mjs +40 -40
- package/fesm2020/mtxDrawer.mjs.map +1 -1
- package/fesm2020/mtxGrid.mjs +152 -137
- package/fesm2020/mtxGrid.mjs.map +1 -1
- package/fesm2020/mtxLoader.mjs +21 -21
- package/fesm2020/mtxLoader.mjs.map +1 -1
- package/fesm2020/mtxPopover.mjs +74 -74
- package/fesm2020/mtxPopover.mjs.map +1 -1
- package/fesm2020/mtxProgress.mjs +7 -7
- package/fesm2020/mtxSelect.mjs +136 -123
- package/fesm2020/mtxSelect.mjs.map +1 -1
- package/fesm2020/mtxSlider.mjs +150 -150
- package/fesm2020/mtxSlider.mjs.map +1 -1
- package/fesm2020/mtxSplit.mjs +91 -76
- package/fesm2020/mtxSplit.mjs.map +1 -1
- package/fesm2020/mtxTooltip.mjs +73 -73
- package/fesm2020/mtxTooltip.mjs.map +1 -1
- package/grid/cell.d.ts +1 -0
- package/grid/cell.scss +1 -1
- package/grid/column-menu.d.ts +1 -1
- package/grid/grid-pipes.d.ts +1 -1
- package/grid/grid.d.ts +8 -5
- package/grid/interfaces.d.ts +63 -15
- package/loader/loader.d.ts +1 -1
- package/package.json +2 -2
- package/popover/popover-types.d.ts +5 -5
- package/progress/progress.d.ts +1 -1
- package/select/select.d.ts +34 -14
- package/split/interfaces.d.ts +13 -1
- package/split/split.d.ts +7 -4
- package/tooltip/tooltip.d.ts +3 -3
package/fesm2020/mtxLoader.mjs
CHANGED
|
@@ -9,6 +9,20 @@ import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
|
|
|
9
9
|
import { coerceBooleanProperty } from '@angular/cdk/coercion';
|
|
10
10
|
|
|
11
11
|
class MtxLoader {
|
|
12
|
+
/** Whether the loader is loading. */
|
|
13
|
+
get loading() {
|
|
14
|
+
return this._loading;
|
|
15
|
+
}
|
|
16
|
+
set loading(value) {
|
|
17
|
+
this._loading = coerceBooleanProperty(value);
|
|
18
|
+
}
|
|
19
|
+
/** Whether the loader has a backdrop. */
|
|
20
|
+
get hasBackdrop() {
|
|
21
|
+
return this._hasBackdrop;
|
|
22
|
+
}
|
|
23
|
+
set hasBackdrop(value) {
|
|
24
|
+
this._hasBackdrop = coerceBooleanProperty(value);
|
|
25
|
+
}
|
|
12
26
|
constructor(_changeDetectorRef) {
|
|
13
27
|
this._changeDetectorRef = _changeDetectorRef;
|
|
14
28
|
/** The loader's type. Can be `spinner` or `progressbar` */
|
|
@@ -28,24 +42,10 @@ class MtxLoader {
|
|
|
28
42
|
this._loading = true;
|
|
29
43
|
this._hasBackdrop = true;
|
|
30
44
|
}
|
|
31
|
-
/** Whether the loader is loading. */
|
|
32
|
-
get loading() {
|
|
33
|
-
return this._loading;
|
|
34
|
-
}
|
|
35
|
-
set loading(value) {
|
|
36
|
-
this._loading = coerceBooleanProperty(value);
|
|
37
|
-
}
|
|
38
|
-
/** Whether the loader has a backdrop. */
|
|
39
|
-
get hasBackdrop() {
|
|
40
|
-
return this._hasBackdrop;
|
|
41
|
-
}
|
|
42
|
-
set hasBackdrop(value) {
|
|
43
|
-
this._hasBackdrop = coerceBooleanProperty(value);
|
|
44
|
-
}
|
|
45
45
|
}
|
|
46
|
-
/** @nocollapse */ MtxLoader.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
47
|
-
/** @nocollapse */ MtxLoader.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
48
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
46
|
+
/** @nocollapse */ MtxLoader.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxLoader, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
47
|
+
/** @nocollapse */ MtxLoader.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: MtxLoader, selector: "mtx-loader", inputs: { type: "type", color: "color", mode: "mode", strokeWidth: "strokeWidth", diameter: "diameter", bufferValue: "bufferValue", value: "value", loading: "loading", hasBackdrop: "hasBackdrop" }, host: { properties: { "class.mtx-loader-loading": "loading" }, classAttribute: "mtx-loader" }, exportAs: ["mtxLoader"], ngImport: i0, template: "<div class=\"mtx-loader-backdrop\" *ngIf=\"loading && hasBackdrop\"></div>\r\n<div class=\"mtx-loader-main\" *ngIf=\"loading\">\r\n <mat-spinner *ngIf=\"type==='spinner'\"\r\n [color]=\"color\"\r\n [strokeWidth]=\"strokeWidth\"\r\n [diameter]=\"diameter\"\r\n [mode]=\"$any(mode)\"\r\n [value]=\"value\">\r\n </mat-spinner>\r\n\r\n <mat-progress-bar *ngIf=\"type==='progressbar'\"\r\n [color]=\"color\"\r\n [mode]=\"$any(mode)\"\r\n [value]=\"value\"\r\n [bufferValue]=\"bufferValue\">\r\n </mat-progress-bar>\r\n</div>\r\n<ng-content></ng-content>\r\n", styles: [".mtx-loader{position:relative;display:block;width:100%;height:100%}.mtx-loader-main{position:absolute;top:0;left:0;z-index:2;display:flex;justify-content:center;align-items:center;width:100%;height:100%}.mtx-loader-main .mat-mdc-spinner{position:relative}.mtx-loader-main .mat-mdc-progress-bar{position:absolute;top:0;left:0;width:100%}.mtx-loader-backdrop{display:block;position:absolute;top:0;left:0;z-index:1;width:100%;height:100%;content:\"\"}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
48
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxLoader, decorators: [{
|
|
49
49
|
type: Component,
|
|
50
50
|
args: [{ selector: 'mtx-loader', exportAs: 'mtxLoader', host: {
|
|
51
51
|
'class': 'mtx-loader',
|
|
@@ -73,10 +73,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImpor
|
|
|
73
73
|
|
|
74
74
|
class MtxLoaderModule {
|
|
75
75
|
}
|
|
76
|
-
/** @nocollapse */ MtxLoaderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
77
|
-
/** @nocollapse */ MtxLoaderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.
|
|
78
|
-
/** @nocollapse */ MtxLoaderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.
|
|
79
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
76
|
+
/** @nocollapse */ MtxLoaderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxLoaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
77
|
+
/** @nocollapse */ MtxLoaderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.1", ngImport: i0, type: MtxLoaderModule, declarations: [MtxLoader], imports: [CommonModule, MatProgressSpinnerModule, MatProgressBarModule], exports: [MtxLoader] });
|
|
78
|
+
/** @nocollapse */ MtxLoaderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxLoaderModule, imports: [CommonModule, MatProgressSpinnerModule, MatProgressBarModule] });
|
|
79
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxLoaderModule, decorators: [{
|
|
80
80
|
type: NgModule,
|
|
81
81
|
args: [{
|
|
82
82
|
imports: [CommonModule, MatProgressSpinnerModule, MatProgressBarModule],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mtxLoader.mjs","sources":["../../../projects/extensions/loader/loader.ts","../../../projects/extensions/loader/loader.html","../../../projects/extensions/loader/loader-module.ts","../../../projects/extensions/loader/mtxLoader.ts"],"sourcesContent":["import {\n Component,\n ChangeDetectionStrategy,\n ViewEncapsulation,\n Input,\n ChangeDetectorRef,\n} from '@angular/core';\nimport { BooleanInput, coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { ThemePalette } from '@angular/material/core';\nimport { ProgressBarMode } from '@angular/material/progress-bar';\nimport { ProgressSpinnerMode } from '@angular/material/progress-spinner';\n\nexport type MtxLoaderType = 'spinner' | 'progressbar';\n\n@Component({\n selector: 'mtx-loader',\n exportAs: 'mtxLoader',\n host: {\n 'class': 'mtx-loader',\n '[class.mtx-loader-loading]': 'loading',\n },\n templateUrl: './loader.html',\n styleUrls: ['./loader.scss'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class MtxLoader {\n /** The loader's type. Can be `spinner` or `progressbar` */\n @Input() type: MtxLoaderType = 'spinner';\n\n /** Theme color palette for the component. */\n @Input() color: ThemePalette = 'primary';\n\n /** Mode of the progress circle or the progress bar. */\n @Input() mode: ProgressSpinnerMode | ProgressBarMode = 'indeterminate';\n\n /** Stroke width of the spinner loader. */\n @Input() strokeWidth = 4;\n\n /** The diameter of the spinner loader (will set width and height of svg). */\n @Input() diameter = 48;\n\n /** Buffer value of the progressbar loader. */\n @Input() bufferValue = 0;\n\n /** Value of the progress circle or the progress bar. */\n @Input() value = 0;\n\n /** Whether the loader is loading. */\n @Input()\n get loading(): boolean {\n return this._loading;\n }\n set loading(value: boolean) {\n this._loading = coerceBooleanProperty(value);\n }\n private _loading = true;\n\n /** Whether the loader has a backdrop. */\n @Input()\n get hasBackdrop(): boolean {\n return this._hasBackdrop;\n }\n set hasBackdrop(value: boolean) {\n this._hasBackdrop = coerceBooleanProperty(value);\n }\n private _hasBackdrop = true;\n\n constructor(private _changeDetectorRef: ChangeDetectorRef) {}\n\n static ngAcceptInputType_loading: BooleanInput;\n static ngAcceptInputType_hasBackdrop: BooleanInput;\n}\n","<div class=\"mtx-loader-backdrop\" *ngIf=\"loading && hasBackdrop\"></div>\r\n<div class=\"mtx-loader-main\" *ngIf=\"loading\">\r\n <mat-spinner *ngIf=\"type==='spinner'\"\r\n [color]=\"color\"\r\n [strokeWidth]=\"strokeWidth\"\r\n [diameter]=\"diameter\"\r\n [mode]=\"$any(mode)\"\r\n [value]=\"value\">\r\n </mat-spinner>\r\n\r\n <mat-progress-bar *ngIf=\"type==='progressbar'\"\r\n [color]=\"color\"\r\n [mode]=\"$any(mode)\"\r\n [value]=\"value\"\r\n [bufferValue]=\"bufferValue\">\r\n </mat-progress-bar>\r\n</div>\r\n<ng-content></ng-content>\r\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatProgressBarModule } from '@angular/material/progress-bar';\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\n\nimport { MtxLoader } from './loader';\n\n@NgModule({\n imports: [CommonModule, MatProgressSpinnerModule, MatProgressBarModule],\n exports: [MtxLoader],\n declarations: [MtxLoader],\n})\nexport class MtxLoaderModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;MA0Ba,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"mtxLoader.mjs","sources":["../../../projects/extensions/loader/loader.ts","../../../projects/extensions/loader/loader.html","../../../projects/extensions/loader/loader-module.ts","../../../projects/extensions/loader/mtxLoader.ts"],"sourcesContent":["import {\n Component,\n ChangeDetectionStrategy,\n ViewEncapsulation,\n Input,\n ChangeDetectorRef,\n} from '@angular/core';\nimport { BooleanInput, coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { ThemePalette } from '@angular/material/core';\nimport { ProgressBarMode } from '@angular/material/progress-bar';\nimport { ProgressSpinnerMode } from '@angular/material/progress-spinner';\n\nexport type MtxLoaderType = 'spinner' | 'progressbar';\n\n@Component({\n selector: 'mtx-loader',\n exportAs: 'mtxLoader',\n host: {\n 'class': 'mtx-loader',\n '[class.mtx-loader-loading]': 'loading',\n },\n templateUrl: './loader.html',\n styleUrls: ['./loader.scss'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class MtxLoader {\n /** The loader's type. Can be `spinner` or `progressbar` */\n @Input() type: MtxLoaderType = 'spinner';\n\n /** Theme color palette for the component. */\n @Input() color: ThemePalette = 'primary';\n\n /** Mode of the progress circle or the progress bar. */\n @Input() mode: ProgressSpinnerMode | ProgressBarMode = 'indeterminate';\n\n /** Stroke width of the spinner loader. */\n @Input() strokeWidth = 4;\n\n /** The diameter of the spinner loader (will set width and height of svg). */\n @Input() diameter = 48;\n\n /** Buffer value of the progressbar loader. */\n @Input() bufferValue = 0;\n\n /** Value of the progress circle or the progress bar. */\n @Input() value = 0;\n\n /** Whether the loader is loading. */\n @Input()\n get loading(): boolean {\n return this._loading;\n }\n set loading(value: boolean) {\n this._loading = coerceBooleanProperty(value);\n }\n private _loading = true;\n\n /** Whether the loader has a backdrop. */\n @Input()\n get hasBackdrop(): boolean {\n return this._hasBackdrop;\n }\n set hasBackdrop(value: boolean) {\n this._hasBackdrop = coerceBooleanProperty(value);\n }\n private _hasBackdrop = true;\n\n constructor(private _changeDetectorRef: ChangeDetectorRef) {}\n\n static ngAcceptInputType_loading: BooleanInput;\n static ngAcceptInputType_hasBackdrop: BooleanInput;\n}\n","<div class=\"mtx-loader-backdrop\" *ngIf=\"loading && hasBackdrop\"></div>\r\n<div class=\"mtx-loader-main\" *ngIf=\"loading\">\r\n <mat-spinner *ngIf=\"type==='spinner'\"\r\n [color]=\"color\"\r\n [strokeWidth]=\"strokeWidth\"\r\n [diameter]=\"diameter\"\r\n [mode]=\"$any(mode)\"\r\n [value]=\"value\">\r\n </mat-spinner>\r\n\r\n <mat-progress-bar *ngIf=\"type==='progressbar'\"\r\n [color]=\"color\"\r\n [mode]=\"$any(mode)\"\r\n [value]=\"value\"\r\n [bufferValue]=\"bufferValue\">\r\n </mat-progress-bar>\r\n</div>\r\n<ng-content></ng-content>\r\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatProgressBarModule } from '@angular/material/progress-bar';\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\n\nimport { MtxLoader } from './loader';\n\n@NgModule({\n imports: [CommonModule, MatProgressSpinnerModule, MatProgressBarModule],\n exports: [MtxLoader],\n declarations: [MtxLoader],\n})\nexport class MtxLoaderModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
package/fesm2020/mtxPopover.mjs
CHANGED
|
@@ -100,9 +100,9 @@ class _MtxPopoverContentBase {
|
|
|
100
100
|
}
|
|
101
101
|
}
|
|
102
102
|
}
|
|
103
|
-
/** @nocollapse */ _MtxPopoverContentBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
104
|
-
/** @nocollapse */ _MtxPopoverContentBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.
|
|
105
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
103
|
+
/** @nocollapse */ _MtxPopoverContentBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: _MtxPopoverContentBase, deps: [{ token: i0.TemplateRef }, { token: i0.ComponentFactoryResolver }, { token: i0.ApplicationRef }, { token: i0.Injector }, { token: i0.ViewContainerRef }, { token: DOCUMENT }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
104
|
+
/** @nocollapse */ _MtxPopoverContentBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: _MtxPopoverContentBase, ngImport: i0 });
|
|
105
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: _MtxPopoverContentBase, decorators: [{
|
|
106
106
|
type: Directive
|
|
107
107
|
}], ctorParameters: function () { return [{ type: i0.TemplateRef }, { type: i0.ComponentFactoryResolver }, { type: i0.ApplicationRef }, { type: i0.Injector }, { type: i0.ViewContainerRef }, { type: undefined, decorators: [{
|
|
108
108
|
type: Inject,
|
|
@@ -113,9 +113,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImpor
|
|
|
113
113
|
*/
|
|
114
114
|
class MtxPopoverContent extends _MtxPopoverContentBase {
|
|
115
115
|
}
|
|
116
|
-
/** @nocollapse */ MtxPopoverContent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
117
|
-
/** @nocollapse */ MtxPopoverContent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.
|
|
118
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
116
|
+
/** @nocollapse */ MtxPopoverContent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxPopoverContent, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
|
117
|
+
/** @nocollapse */ MtxPopoverContent.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: MtxPopoverContent, selector: "ng-template[mtxPopoverContent]", providers: [{ provide: MTX_POPOVER_CONTENT, useExisting: MtxPopoverContent }], usesInheritance: true, ngImport: i0 });
|
|
118
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxPopoverContent, decorators: [{
|
|
119
119
|
type: Directive,
|
|
120
120
|
args: [{
|
|
121
121
|
selector: 'ng-template[mtxPopoverContent]',
|
|
@@ -163,45 +163,6 @@ function MTX_POPOVER_DEFAULT_OPTIONS_FACTORY() {
|
|
|
163
163
|
}
|
|
164
164
|
let popoverPanelUid = 0;
|
|
165
165
|
class MtxPopover {
|
|
166
|
-
constructor(_elementRef, _ngZone, _defaultOptions) {
|
|
167
|
-
this._elementRef = _elementRef;
|
|
168
|
-
this._ngZone = _ngZone;
|
|
169
|
-
this._defaultOptions = _defaultOptions;
|
|
170
|
-
this._triggerEvent = this._defaultOptions.triggerEvent ?? 'hover';
|
|
171
|
-
this._enterDelay = this._defaultOptions.enterDelay ?? 100;
|
|
172
|
-
this._leaveDelay = this._defaultOptions.leaveDelay ?? 100;
|
|
173
|
-
this._position = this._defaultOptions.position ?? ['below', 'after'];
|
|
174
|
-
this._panelOffsetX = this._defaultOptions.xOffset ?? 0;
|
|
175
|
-
this._panelOffsetY = this._defaultOptions.yOffset ?? 0;
|
|
176
|
-
this._arrowWidth = this._defaultOptions.arrowWidth ?? 16;
|
|
177
|
-
this._arrowHeight = this._defaultOptions.arrowHeight ?? 16;
|
|
178
|
-
this._arrowOffsetX = this._defaultOptions.arrowOffsetX ?? 20;
|
|
179
|
-
this._arrowOffsetY = this._defaultOptions.arrowOffsetY ?? 20;
|
|
180
|
-
this._closeOnPanelClick = this._defaultOptions.closeOnPanelClick ?? false;
|
|
181
|
-
this._closeOnBackdropClick = this._defaultOptions.closeOnBackdropClick ?? true;
|
|
182
|
-
this._focusTrapEnabled = this._defaultOptions.focusTrapEnabled ?? false;
|
|
183
|
-
this._focusTrapAutoCaptureEnabled = this._defaultOptions.focusTrapAutoCaptureEnabled ?? false;
|
|
184
|
-
this._hasBackdrop = this._defaultOptions.hasBackdrop;
|
|
185
|
-
this._elevation = this._defaultOptions.elevation ?? 8;
|
|
186
|
-
this._elevationPrefix = 'mat-elevation-z';
|
|
187
|
-
/** Config object to be passed into the popover's ngClass. */
|
|
188
|
-
this._classList = {};
|
|
189
|
-
/** Current state of the panel animation. */
|
|
190
|
-
this._panelAnimationState = 'void';
|
|
191
|
-
/** Emits whenever an animation on the popover completes. */
|
|
192
|
-
this._animationDone = new Subject();
|
|
193
|
-
/** Whether the popover is animating. */
|
|
194
|
-
this._isAnimating = false;
|
|
195
|
-
/** Closing disabled on popover */
|
|
196
|
-
this.closeDisabled = false;
|
|
197
|
-
/** Class or list of classes to be added to the overlay panel. */
|
|
198
|
-
this.overlayPanelClass = this._defaultOptions.overlayPanelClass || '';
|
|
199
|
-
/** Class to be added to the backdrop element. */
|
|
200
|
-
this.backdropClass = this._defaultOptions.backdropClass;
|
|
201
|
-
/** Event emitted when the popover is closed. */
|
|
202
|
-
this.closed = new EventEmitter();
|
|
203
|
-
this.panelId = `mtx-popover-panel-${popoverPanelUid++}`;
|
|
204
|
-
}
|
|
205
166
|
/** Popover's trigger event. */
|
|
206
167
|
get triggerEvent() {
|
|
207
168
|
return this._triggerEvent;
|
|
@@ -350,6 +311,45 @@ class MtxPopover {
|
|
|
350
311
|
set classList(classes) {
|
|
351
312
|
this.panelClass = classes;
|
|
352
313
|
}
|
|
314
|
+
constructor(_elementRef, _ngZone, _defaultOptions) {
|
|
315
|
+
this._elementRef = _elementRef;
|
|
316
|
+
this._ngZone = _ngZone;
|
|
317
|
+
this._defaultOptions = _defaultOptions;
|
|
318
|
+
this._triggerEvent = this._defaultOptions.triggerEvent ?? 'hover';
|
|
319
|
+
this._enterDelay = this._defaultOptions.enterDelay ?? 100;
|
|
320
|
+
this._leaveDelay = this._defaultOptions.leaveDelay ?? 100;
|
|
321
|
+
this._position = this._defaultOptions.position ?? ['below', 'after'];
|
|
322
|
+
this._panelOffsetX = this._defaultOptions.xOffset ?? 0;
|
|
323
|
+
this._panelOffsetY = this._defaultOptions.yOffset ?? 0;
|
|
324
|
+
this._arrowWidth = this._defaultOptions.arrowWidth ?? 16;
|
|
325
|
+
this._arrowHeight = this._defaultOptions.arrowHeight ?? 16;
|
|
326
|
+
this._arrowOffsetX = this._defaultOptions.arrowOffsetX ?? 20;
|
|
327
|
+
this._arrowOffsetY = this._defaultOptions.arrowOffsetY ?? 20;
|
|
328
|
+
this._closeOnPanelClick = this._defaultOptions.closeOnPanelClick ?? false;
|
|
329
|
+
this._closeOnBackdropClick = this._defaultOptions.closeOnBackdropClick ?? true;
|
|
330
|
+
this._focusTrapEnabled = this._defaultOptions.focusTrapEnabled ?? false;
|
|
331
|
+
this._focusTrapAutoCaptureEnabled = this._defaultOptions.focusTrapAutoCaptureEnabled ?? false;
|
|
332
|
+
this._hasBackdrop = this._defaultOptions.hasBackdrop;
|
|
333
|
+
this._elevation = this._defaultOptions.elevation ?? 8;
|
|
334
|
+
this._elevationPrefix = 'mat-elevation-z';
|
|
335
|
+
/** Config object to be passed into the popover's ngClass. */
|
|
336
|
+
this._classList = {};
|
|
337
|
+
/** Current state of the panel animation. */
|
|
338
|
+
this._panelAnimationState = 'void';
|
|
339
|
+
/** Emits whenever an animation on the popover completes. */
|
|
340
|
+
this._animationDone = new Subject();
|
|
341
|
+
/** Whether the popover is animating. */
|
|
342
|
+
this._isAnimating = false;
|
|
343
|
+
/** Closing disabled on popover */
|
|
344
|
+
this.closeDisabled = false;
|
|
345
|
+
/** Class or list of classes to be added to the overlay panel. */
|
|
346
|
+
this.overlayPanelClass = this._defaultOptions.overlayPanelClass || '';
|
|
347
|
+
/** Class to be added to the backdrop element. */
|
|
348
|
+
this.backdropClass = this._defaultOptions.backdropClass;
|
|
349
|
+
/** Event emitted when the popover is closed. */
|
|
350
|
+
this.closed = new EventEmitter();
|
|
351
|
+
this.panelId = `mtx-popover-panel-${popoverPanelUid++}`;
|
|
352
|
+
}
|
|
353
353
|
ngOnInit() {
|
|
354
354
|
this.setPositionClasses();
|
|
355
355
|
}
|
|
@@ -457,9 +457,9 @@ class MtxPopover {
|
|
|
457
457
|
this._isAnimating = true;
|
|
458
458
|
}
|
|
459
459
|
}
|
|
460
|
-
/** @nocollapse */ MtxPopover.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
461
|
-
/** @nocollapse */ MtxPopover.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
462
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
460
|
+
/** @nocollapse */ MtxPopover.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxPopover, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: MTX_POPOVER_DEFAULT_OPTIONS }], target: i0.ɵɵFactoryTarget.Component });
|
|
461
|
+
/** @nocollapse */ MtxPopover.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.1", type: MtxPopover, selector: "mtx-popover", inputs: { backdropClass: "backdropClass", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], ariaDescribedby: ["aria-describedby", "ariaDescribedby"], triggerEvent: "triggerEvent", enterDelay: "enterDelay", leaveDelay: "leaveDelay", position: "position", xOffset: "xOffset", yOffset: "yOffset", arrowWidth: "arrowWidth", arrowHeight: "arrowHeight", arrowOffsetX: "arrowOffsetX", arrowOffsetY: "arrowOffsetY", closeOnPanelClick: "closeOnPanelClick", closeOnBackdropClick: "closeOnBackdropClick", focusTrapEnabled: "focusTrapEnabled", focusTrapAutoCaptureEnabled: "focusTrapAutoCaptureEnabled", hasBackdrop: "hasBackdrop", elevation: "elevation", panelClass: ["class", "panelClass"], classList: "classList" }, outputs: { closed: "closed" }, queries: [{ propertyName: "lazyContent", first: true, predicate: MTX_POPOVER_CONTENT, descendants: true }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], exportAs: ["mtxPopover"], ngImport: i0, template: "<ng-template>\r\n <div class=\"mtx-popover-panel\"\r\n [id]=\"panelId\"\r\n [ngClass]=\"_classList\"\r\n (keydown)=\"_handleKeydown($event)\"\r\n (click)=\"_handleClick()\"\r\n (mouseover)=\"_handleMouseOver()\"\r\n (mouseleave)=\"_handleMouseLeave()\"\r\n [@transformPopover]=\"_panelAnimationState\"\r\n (@transformPopover.start)=\"_onAnimationStart($event)\"\r\n (@transformPopover.done)=\"_onAnimationDone($event)\"\r\n tabindex=\"-1\"\r\n role=\"dialog\"\r\n [attr.aria-label]=\"ariaLabel || null\"\r\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\r\n [attr.aria-describedby]=\"ariaDescribedby || null\"\r\n [cdkTrapFocus]=\"focusTrapEnabled\"\r\n [cdkTrapFocusAutoCapture]=\"focusTrapAutoCaptureEnabled\">\r\n <div class=\"mtx-popover-content\">\r\n <ng-content></ng-content>\r\n </div>\r\n <div class=\"mtx-popover-direction-arrow\" [ngStyle]=\"arrowStyles\"></div>\r\n </div>\r\n</ng-template>\r\n", styles: [".mtx-popover-panel{position:relative;max-height:calc(100vh - 48px);padding:8px;border-radius:4px;font-size:16px;outline:0}.mtx-popover-panel[class*=mtx-popover-below]{margin-top:calc(.5em + 2px)}.mtx-popover-panel[class*=mtx-popover-above]{margin-bottom:calc(.5em + 2px)}.mtx-popover-panel[class*=mtx-popover-before]{margin-right:calc(.5em + 2px)}[dir=rtl] .mtx-popover-panel[class*=mtx-popover-before]{margin-right:auto;margin-left:calc(.5em + 2px)}.mtx-popover-panel[class*=mtx-popover-after]{margin-left:calc(.5em + 2px)}[dir=rtl] .mtx-popover-panel[class*=mtx-popover-after]{margin-left:auto;margin-right:calc(.5em + 2px)}.mtx-popover-direction-arrow{position:absolute}.mtx-popover-direction-arrow:before,.mtx-popover-direction-arrow:after{position:absolute;display:inline-block;content:\"\";border-width:.5em;border-style:solid}.mtx-popover-direction-arrow:after{border-width:calc(.5em - 1px)}[class*=mtx-popover-below] .mtx-popover-direction-arrow,[class*=mtx-popover-above] .mtx-popover-direction-arrow{width:1em}[class*=mtx-popover-below] .mtx-popover-direction-arrow:after,[class*=mtx-popover-above] .mtx-popover-direction-arrow:after{left:1px}[dir=rtl] [class*=mtx-popover-below] .mtx-popover-direction-arrow:after,[dir=rtl] [class*=mtx-popover-above] .mtx-popover-direction-arrow:after{right:1px;left:auto}[class*=mtx-popover-below] .mtx-popover-direction-arrow{top:0}[class*=mtx-popover-below] .mtx-popover-direction-arrow:before,[class*=mtx-popover-below] .mtx-popover-direction-arrow:after{bottom:0;border-top-width:0}[class*=mtx-popover-above] .mtx-popover-direction-arrow{bottom:0}[class*=mtx-popover-above] .mtx-popover-direction-arrow:before,[class*=mtx-popover-above] .mtx-popover-direction-arrow:after{top:0;border-bottom-width:0}[class*=mtx-popover-before] .mtx-popover-direction-arrow,[class*=mtx-popover-after] .mtx-popover-direction-arrow{height:1em}[class*=mtx-popover-before] .mtx-popover-direction-arrow:after,[class*=mtx-popover-after] .mtx-popover-direction-arrow:after{top:1px}[class*=mtx-popover-before] .mtx-popover-direction-arrow{right:0}[class*=mtx-popover-before] .mtx-popover-direction-arrow:before,[class*=mtx-popover-before] .mtx-popover-direction-arrow:after{left:0;border-right-width:0}[dir=rtl] [class*=mtx-popover-before] .mtx-popover-direction-arrow{right:auto;left:0}[dir=rtl] [class*=mtx-popover-before] .mtx-popover-direction-arrow:before,[dir=rtl] [class*=mtx-popover-before] .mtx-popover-direction-arrow:after{left:auto;right:0;border-left-width:0}[dir=rtl] [class*=mtx-popover-before] .mtx-popover-direction-arrow:before{border-right-width:.5em}[dir=rtl] [class*=mtx-popover-before] .mtx-popover-direction-arrow:after{border-right-width:calc(.5em - 1px)}[class*=mtx-popover-after] .mtx-popover-direction-arrow{left:0}[class*=mtx-popover-after] .mtx-popover-direction-arrow:before,[class*=mtx-popover-after] .mtx-popover-direction-arrow:after{right:0;border-left-width:0}[dir=rtl] [class*=mtx-popover-after] .mtx-popover-direction-arrow{left:auto;right:0}[dir=rtl] [class*=mtx-popover-after] .mtx-popover-direction-arrow:before,[dir=rtl] [class*=mtx-popover-after] .mtx-popover-direction-arrow:after{right:auto;left:0;border-right-width:0}[dir=rtl] [class*=mtx-popover-after] .mtx-popover-direction-arrow:before{border-left-width:.5em}[dir=rtl] [class*=mtx-popover-after] .mtx-popover-direction-arrow:after{border-left-width:calc(.5em - 1px)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i3.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], animations: [transformPopover], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
462
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxPopover, decorators: [{
|
|
463
463
|
type: Component,
|
|
464
464
|
args: [{ selector: 'mtx-popover', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, animations: [transformPopover], exportAs: 'mtxPopover', template: "<ng-template>\r\n <div class=\"mtx-popover-panel\"\r\n [id]=\"panelId\"\r\n [ngClass]=\"_classList\"\r\n (keydown)=\"_handleKeydown($event)\"\r\n (click)=\"_handleClick()\"\r\n (mouseover)=\"_handleMouseOver()\"\r\n (mouseleave)=\"_handleMouseLeave()\"\r\n [@transformPopover]=\"_panelAnimationState\"\r\n (@transformPopover.start)=\"_onAnimationStart($event)\"\r\n (@transformPopover.done)=\"_onAnimationDone($event)\"\r\n tabindex=\"-1\"\r\n role=\"dialog\"\r\n [attr.aria-label]=\"ariaLabel || null\"\r\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\r\n [attr.aria-describedby]=\"ariaDescribedby || null\"\r\n [cdkTrapFocus]=\"focusTrapEnabled\"\r\n [cdkTrapFocusAutoCapture]=\"focusTrapAutoCaptureEnabled\">\r\n <div class=\"mtx-popover-content\">\r\n <ng-content></ng-content>\r\n </div>\r\n <div class=\"mtx-popover-direction-arrow\" [ngStyle]=\"arrowStyles\"></div>\r\n </div>\r\n</ng-template>\r\n", styles: [".mtx-popover-panel{position:relative;max-height:calc(100vh - 48px);padding:8px;border-radius:4px;font-size:16px;outline:0}.mtx-popover-panel[class*=mtx-popover-below]{margin-top:calc(.5em + 2px)}.mtx-popover-panel[class*=mtx-popover-above]{margin-bottom:calc(.5em + 2px)}.mtx-popover-panel[class*=mtx-popover-before]{margin-right:calc(.5em + 2px)}[dir=rtl] .mtx-popover-panel[class*=mtx-popover-before]{margin-right:auto;margin-left:calc(.5em + 2px)}.mtx-popover-panel[class*=mtx-popover-after]{margin-left:calc(.5em + 2px)}[dir=rtl] .mtx-popover-panel[class*=mtx-popover-after]{margin-left:auto;margin-right:calc(.5em + 2px)}.mtx-popover-direction-arrow{position:absolute}.mtx-popover-direction-arrow:before,.mtx-popover-direction-arrow:after{position:absolute;display:inline-block;content:\"\";border-width:.5em;border-style:solid}.mtx-popover-direction-arrow:after{border-width:calc(.5em - 1px)}[class*=mtx-popover-below] .mtx-popover-direction-arrow,[class*=mtx-popover-above] .mtx-popover-direction-arrow{width:1em}[class*=mtx-popover-below] .mtx-popover-direction-arrow:after,[class*=mtx-popover-above] .mtx-popover-direction-arrow:after{left:1px}[dir=rtl] [class*=mtx-popover-below] .mtx-popover-direction-arrow:after,[dir=rtl] [class*=mtx-popover-above] .mtx-popover-direction-arrow:after{right:1px;left:auto}[class*=mtx-popover-below] .mtx-popover-direction-arrow{top:0}[class*=mtx-popover-below] .mtx-popover-direction-arrow:before,[class*=mtx-popover-below] .mtx-popover-direction-arrow:after{bottom:0;border-top-width:0}[class*=mtx-popover-above] .mtx-popover-direction-arrow{bottom:0}[class*=mtx-popover-above] .mtx-popover-direction-arrow:before,[class*=mtx-popover-above] .mtx-popover-direction-arrow:after{top:0;border-bottom-width:0}[class*=mtx-popover-before] .mtx-popover-direction-arrow,[class*=mtx-popover-after] .mtx-popover-direction-arrow{height:1em}[class*=mtx-popover-before] .mtx-popover-direction-arrow:after,[class*=mtx-popover-after] .mtx-popover-direction-arrow:after{top:1px}[class*=mtx-popover-before] .mtx-popover-direction-arrow{right:0}[class*=mtx-popover-before] .mtx-popover-direction-arrow:before,[class*=mtx-popover-before] .mtx-popover-direction-arrow:after{left:0;border-right-width:0}[dir=rtl] [class*=mtx-popover-before] .mtx-popover-direction-arrow{right:auto;left:0}[dir=rtl] [class*=mtx-popover-before] .mtx-popover-direction-arrow:before,[dir=rtl] [class*=mtx-popover-before] .mtx-popover-direction-arrow:after{left:auto;right:0;border-left-width:0}[dir=rtl] [class*=mtx-popover-before] .mtx-popover-direction-arrow:before{border-right-width:.5em}[dir=rtl] [class*=mtx-popover-before] .mtx-popover-direction-arrow:after{border-right-width:calc(.5em - 1px)}[class*=mtx-popover-after] .mtx-popover-direction-arrow{left:0}[class*=mtx-popover-after] .mtx-popover-direction-arrow:before,[class*=mtx-popover-after] .mtx-popover-direction-arrow:after{right:0;border-left-width:0}[dir=rtl] [class*=mtx-popover-after] .mtx-popover-direction-arrow{left:auto;right:0}[dir=rtl] [class*=mtx-popover-after] .mtx-popover-direction-arrow:before,[dir=rtl] [class*=mtx-popover-after] .mtx-popover-direction-arrow:after{right:auto;left:0;border-right-width:0}[dir=rtl] [class*=mtx-popover-after] .mtx-popover-direction-arrow:before{border-left-width:.5em}[dir=rtl] [class*=mtx-popover-after] .mtx-popover-direction-arrow:after{border-left-width:calc(.5em - 1px)}\n"] }]
|
|
465
465
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: undefined, decorators: [{
|
|
@@ -540,6 +540,22 @@ const MTX_POPOVER_SCROLL_STRATEGY_FACTORY_PROVIDER = {
|
|
|
540
540
|
* responsible for toggling the display of the provided popover instance.
|
|
541
541
|
*/
|
|
542
542
|
class MtxPopoverTrigger {
|
|
543
|
+
/** References the popover instance that the trigger is associated with. */
|
|
544
|
+
get popover() {
|
|
545
|
+
return this._popover;
|
|
546
|
+
}
|
|
547
|
+
set popover(popover) {
|
|
548
|
+
if (popover === this._popover) {
|
|
549
|
+
return;
|
|
550
|
+
}
|
|
551
|
+
this._popover = popover;
|
|
552
|
+
this._popoverCloseSubscription.unsubscribe();
|
|
553
|
+
if (popover) {
|
|
554
|
+
this._popoverCloseSubscription = popover.closed.subscribe((reason) => {
|
|
555
|
+
this._destroyPopover();
|
|
556
|
+
});
|
|
557
|
+
}
|
|
558
|
+
}
|
|
543
559
|
constructor(_overlay, _elementRef, _viewContainerRef, scrollStrategy, _dir, _changeDetectorRef, _focusMonitor) {
|
|
544
560
|
this._overlay = _overlay;
|
|
545
561
|
this._elementRef = _elementRef;
|
|
@@ -562,22 +578,6 @@ class MtxPopoverTrigger {
|
|
|
562
578
|
this.popoverClosed = new EventEmitter();
|
|
563
579
|
this._scrollStrategy = scrollStrategy;
|
|
564
580
|
}
|
|
565
|
-
/** References the popover instance that the trigger is associated with. */
|
|
566
|
-
get popover() {
|
|
567
|
-
return this._popover;
|
|
568
|
-
}
|
|
569
|
-
set popover(popover) {
|
|
570
|
-
if (popover === this._popover) {
|
|
571
|
-
return;
|
|
572
|
-
}
|
|
573
|
-
this._popover = popover;
|
|
574
|
-
this._popoverCloseSubscription.unsubscribe();
|
|
575
|
-
if (popover) {
|
|
576
|
-
this._popoverCloseSubscription = popover.closed.subscribe((reason) => {
|
|
577
|
-
this._destroyPopover();
|
|
578
|
-
});
|
|
579
|
-
}
|
|
580
|
-
}
|
|
581
581
|
ngAfterContentInit() {
|
|
582
582
|
this._checkPopover();
|
|
583
583
|
this._setCurrentConfig();
|
|
@@ -940,9 +940,9 @@ class MtxPopoverTrigger {
|
|
|
940
940
|
return this._portal;
|
|
941
941
|
}
|
|
942
942
|
}
|
|
943
|
-
/** @nocollapse */ MtxPopoverTrigger.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
944
|
-
/** @nocollapse */ MtxPopoverTrigger.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.
|
|
945
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
943
|
+
/** @nocollapse */ MtxPopoverTrigger.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxPopoverTrigger, deps: [{ token: i1$1.Overlay }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: MTX_POPOVER_SCROLL_STRATEGY }, { token: i2.Directionality, optional: true }, { token: i0.ChangeDetectorRef }, { token: i3.FocusMonitor }], target: i0.ɵɵFactoryTarget.Directive });
|
|
944
|
+
/** @nocollapse */ MtxPopoverTrigger.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: MtxPopoverTrigger, selector: "[mtx-popover-trigger-for], [mtxPopoverTriggerFor]", inputs: { popover: ["mtxPopoverTriggerFor", "popover"], popoverData: ["mtxPopoverTriggerData", "popoverData"], targetElement: ["mtxPopoverTargetAt", "targetElement"], triggerEvent: ["mtxPopoverTriggerOn", "triggerEvent"] }, outputs: { popoverOpened: "popoverOpened", popoverClosed: "popoverClosed" }, host: { attributes: { "aria-haspopup": "true" }, listeners: { "click": "_handleClick($event)", "mouseenter": "_handleMouseEnter($event)", "mouseleave": "_handleMouseLeave($event)", "mousedown": "_handleMousedown($event)", "keydown": "_handleKeydown($event)" }, properties: { "attr.aria-expanded": "popoverOpen || null", "attr.aria-controls": "popoverOpen ? popover.panelId : null" } }, exportAs: ["mtxPopoverTrigger"], ngImport: i0 });
|
|
945
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxPopoverTrigger, decorators: [{
|
|
946
946
|
type: Directive,
|
|
947
947
|
args: [{
|
|
948
948
|
selector: '[mtx-popover-trigger-for], [mtxPopoverTriggerFor]',
|
|
@@ -986,9 +986,9 @@ class MtxPopoverTarget {
|
|
|
986
986
|
this.elementRef = elementRef;
|
|
987
987
|
}
|
|
988
988
|
}
|
|
989
|
-
/** @nocollapse */ MtxPopoverTarget.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
990
|
-
/** @nocollapse */ MtxPopoverTarget.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.
|
|
991
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
989
|
+
/** @nocollapse */ MtxPopoverTarget.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxPopoverTarget, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
990
|
+
/** @nocollapse */ MtxPopoverTarget.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.1", type: MtxPopoverTarget, selector: "mtx-popover-target, [mtxPopoverTarget]", exportAs: ["mtxPopoverTarget"], ngImport: i0 });
|
|
991
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxPopoverTarget, decorators: [{
|
|
992
992
|
type: Directive,
|
|
993
993
|
args: [{
|
|
994
994
|
selector: 'mtx-popover-target, [mtxPopoverTarget]',
|
|
@@ -998,10 +998,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImpor
|
|
|
998
998
|
|
|
999
999
|
class MtxPopoverModule {
|
|
1000
1000
|
}
|
|
1001
|
-
/** @nocollapse */ MtxPopoverModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
1002
|
-
/** @nocollapse */ MtxPopoverModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.
|
|
1003
|
-
/** @nocollapse */ MtxPopoverModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.
|
|
1004
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
1001
|
+
/** @nocollapse */ MtxPopoverModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
1002
|
+
/** @nocollapse */ MtxPopoverModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.1", ngImport: i0, type: MtxPopoverModule, declarations: [MtxPopover, MtxPopoverTrigger, MtxPopoverTarget, MtxPopoverContent], imports: [CommonModule, OverlayModule, A11yModule], exports: [MtxPopover, MtxPopoverTrigger, MtxPopoverTarget, MtxPopoverContent] });
|
|
1003
|
+
/** @nocollapse */ MtxPopoverModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxPopoverModule, providers: [MTX_POPOVER_SCROLL_STRATEGY_FACTORY_PROVIDER], imports: [CommonModule, OverlayModule, A11yModule] });
|
|
1004
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.1", ngImport: i0, type: MtxPopoverModule, decorators: [{
|
|
1005
1005
|
type: NgModule,
|
|
1006
1006
|
args: [{
|
|
1007
1007
|
imports: [CommonModule, OverlayModule, A11yModule],
|