@ng-matero/extensions 21.2.1 → 21.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/mtxAlert.mjs +7 -7
- package/fesm2022/mtxAlert.mjs.map +1 -1
- package/fesm2022/mtxButton.mjs +7 -7
- package/fesm2022/mtxButton.mjs.map +1 -1
- package/fesm2022/mtxCheckboxGroup.mjs +7 -7
- package/fesm2022/mtxCheckboxGroup.mjs.map +1 -1
- package/fesm2022/mtxColorpicker.mjs +20 -20
- package/fesm2022/mtxColorpicker.mjs.map +1 -1
- package/fesm2022/mtxColumnResize.mjs +43 -43
- package/fesm2022/mtxColumnResize.mjs.map +1 -1
- package/fesm2022/mtxCore.mjs +22 -22
- package/fesm2022/mtxCore.mjs.map +1 -1
- package/fesm2022/mtxDatetimepicker.mjs +60 -60
- package/fesm2022/mtxDatetimepicker.mjs.map +1 -1
- package/fesm2022/mtxDialog.mjs +10 -10
- package/fesm2022/mtxDialog.mjs.map +1 -1
- package/fesm2022/mtxDrawer.mjs +10 -10
- package/fesm2022/mtxDrawer.mjs.map +1 -1
- package/fesm2022/mtxGrid.mjs +69 -69
- package/fesm2022/mtxGrid.mjs.map +1 -1
- package/fesm2022/mtxLoader.mjs +7 -7
- package/fesm2022/mtxLoader.mjs.map +1 -1
- package/fesm2022/mtxPhotoviewer.mjs +7 -7
- package/fesm2022/mtxPhotoviewer.mjs.map +1 -1
- package/fesm2022/mtxPopover.mjs +29 -35
- package/fesm2022/mtxPopover.mjs.map +1 -1
- package/fesm2022/mtxProgress.mjs +7 -7
- package/fesm2022/mtxProgress.mjs.map +1 -1
- package/fesm2022/mtxSelect.mjs +58 -64
- package/fesm2022/mtxSelect.mjs.map +1 -1
- package/fesm2022/mtxSplit.mjs +10 -10
- package/fesm2022/mtxSplit.mjs.map +1 -1
- package/fesm2022/mtxTooltip.mjs +14 -13
- package/fesm2022/mtxTooltip.mjs.map +1 -1
- package/package.json +4 -3
- package/types/mtxColorpicker.d.ts +1 -1
- package/types/mtxDatetimepicker.d.ts +1 -1
- package/types/mtxGrid.d.ts +1 -1
- package/types/mtxPopover.d.ts +2 -3
- package/types/mtxSelect.d.ts +3 -4
- package/types/mtxSplit.d.ts +1 -1
- package/types/mtxTooltip.d.ts +4 -4
package/fesm2022/mtxLoader.mjs
CHANGED
|
@@ -26,10 +26,10 @@ class MtxLoader {
|
|
|
26
26
|
/** Whether the loader has a backdrop. */
|
|
27
27
|
this.hasBackdrop = true;
|
|
28
28
|
}
|
|
29
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
30
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
29
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxLoader, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
30
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: MtxLoader, isStandalone: true, selector: "mtx-loader", inputs: { type: "type", color: "color", mode: "mode", strokeWidth: "strokeWidth", diameter: "diameter", bufferValue: "bufferValue", value: "value", loading: ["loading", "loading", booleanAttribute], hasBackdrop: ["hasBackdrop", "hasBackdrop", booleanAttribute] }, host: { properties: { "class.mtx-loader-loading": "loading" }, classAttribute: "mtx-loader" }, exportAs: ["mtxLoader"], ngImport: i0, template: "@if (loading && hasBackdrop) {\n <div class=\"mtx-loader-backdrop\"></div>\n}\n@if (loading) {\n <div class=\"mtx-loader-main\">\n @if (type === 'spinner') {\n <mat-spinner\n [color]=\"color\"\n [strokeWidth]=\"strokeWidth\"\n [diameter]=\"diameter\"\n [mode]=\"$any(mode)\"\n [value]=\"value\"\n ></mat-spinner>\n }\n @if (type === 'progressbar') {\n <mat-progress-bar\n [color]=\"color\"\n [mode]=\"$any(mode)\"\n [value]=\"value\"\n [bufferValue]=\"bufferValue\"\n ></mat-progress-bar>\n }\n </div>\n}\n<ng-content></ng-content>\n", styles: [".mtx-loader{position:relative;display:block;width:100%;height:100%}.mtx-loader-main{position:absolute;top:0;left:0;z-index:210;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{position:absolute;top:0;left:0;z-index:200;display:block;width:100%;height:100%;content:\"\";background-color:var(--mtx-loader-backdrop-background-color, color-mix(in srgb, var(--mat-sys-surface) 75%, transparent))}\n"], dependencies: [{ kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
31
31
|
}
|
|
32
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
32
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxLoader, decorators: [{
|
|
33
33
|
type: Component,
|
|
34
34
|
args: [{ selector: 'mtx-loader', exportAs: 'mtxLoader', host: {
|
|
35
35
|
'class': 'mtx-loader',
|
|
@@ -58,11 +58,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImpor
|
|
|
58
58
|
}] } });
|
|
59
59
|
|
|
60
60
|
class MtxLoaderModule {
|
|
61
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
62
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.
|
|
63
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.
|
|
61
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxLoaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
62
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.11", ngImport: i0, type: MtxLoaderModule, imports: [CommonModule, MatProgressSpinnerModule, MatProgressBarModule, MtxLoader], exports: [MtxLoader] }); }
|
|
63
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxLoaderModule, imports: [CommonModule, MatProgressSpinnerModule, MatProgressBarModule, MtxLoader] }); }
|
|
64
64
|
}
|
|
65
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
65
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxLoaderModule, decorators: [{
|
|
66
66
|
type: NgModule,
|
|
67
67
|
args: [{
|
|
68
68
|
imports: [CommonModule, MatProgressSpinnerModule, MatProgressBarModule, MtxLoader],
|
|
@@ -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 ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n Input,\n ViewEncapsulation,\n booleanAttribute,\n inject,\n} from '@angular/core';\nimport { ThemePalette } from '@angular/material/core';\nimport { MatProgressBar, ProgressBarMode } from '@angular/material/progress-bar';\nimport { MatProgressSpinner, 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 styleUrl: './loader.scss',\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [MatProgressSpinner, MatProgressBar],\n})\nexport class MtxLoader {\n private _changeDetectorRef = inject(ChangeDetectorRef);\n\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({ transform: booleanAttribute }) loading = true;\n\n /** Whether the loader has a backdrop. */\n @Input({ transform: booleanAttribute }) hasBackdrop = true;\n}\n","@if (loading && hasBackdrop) {\n <div class=\"mtx-loader-backdrop\"></div>\n}\n@if (loading) {\n <div class=\"mtx-loader-main\">\n @if (type === 'spinner') {\n <mat-spinner\n [color]=\"color\"\n [strokeWidth]=\"strokeWidth\"\n [diameter]=\"diameter\"\n [mode]=\"$any(mode)\"\n [value]=\"value\"\n ></mat-spinner>\n }\n @if (type === 'progressbar') {\n <mat-progress-bar\n [color]=\"color\"\n [mode]=\"$any(mode)\"\n [value]=\"value\"\n [bufferValue]=\"bufferValue\"\n ></mat-progress-bar>\n }\n </div>\n}\n<ng-content></ng-content>\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, MtxLoader],\n exports: [MtxLoader],\n})\nexport class MtxLoaderModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;MA4Ba,SAAS,CAAA;AAbtB,IAAA,WAAA,GAAA;AAcU,QAAA,IAAA,CAAA,kBAAkB,GAAG,MAAM,CAAC,iBAAiB,CAAC;;QAG7C,IAAA,CAAA,IAAI,GAAkB,SAAS;;QAG/B,IAAA,CAAA,KAAK,GAAiB,SAAS;;QAG/B,IAAA,CAAA,IAAI,GAA0C,eAAe;;QAG7D,IAAA,CAAA,WAAW,GAAG,CAAC;;QAGf,IAAA,CAAA,QAAQ,GAAG,EAAE;;QAGb,IAAA,CAAA,WAAW,GAAG,CAAC;;QAGf,IAAA,CAAA,KAAK,GAAG,CAAC;;QAGsB,IAAA,CAAA,OAAO,GAAG,IAAI;;QAGd,IAAA,CAAA,WAAW,GAAG,IAAI;AAC3D,IAAA;
|
|
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 ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n Input,\n ViewEncapsulation,\n booleanAttribute,\n inject,\n} from '@angular/core';\nimport { ThemePalette } from '@angular/material/core';\nimport { MatProgressBar, ProgressBarMode } from '@angular/material/progress-bar';\nimport { MatProgressSpinner, 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 styleUrl: './loader.scss',\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [MatProgressSpinner, MatProgressBar],\n})\nexport class MtxLoader {\n private _changeDetectorRef = inject(ChangeDetectorRef);\n\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({ transform: booleanAttribute }) loading = true;\n\n /** Whether the loader has a backdrop. */\n @Input({ transform: booleanAttribute }) hasBackdrop = true;\n}\n","@if (loading && hasBackdrop) {\n <div class=\"mtx-loader-backdrop\"></div>\n}\n@if (loading) {\n <div class=\"mtx-loader-main\">\n @if (type === 'spinner') {\n <mat-spinner\n [color]=\"color\"\n [strokeWidth]=\"strokeWidth\"\n [diameter]=\"diameter\"\n [mode]=\"$any(mode)\"\n [value]=\"value\"\n ></mat-spinner>\n }\n @if (type === 'progressbar') {\n <mat-progress-bar\n [color]=\"color\"\n [mode]=\"$any(mode)\"\n [value]=\"value\"\n [bufferValue]=\"bufferValue\"\n ></mat-progress-bar>\n }\n </div>\n}\n<ng-content></ng-content>\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, MtxLoader],\n exports: [MtxLoader],\n})\nexport class MtxLoaderModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;MA4Ba,SAAS,CAAA;AAbtB,IAAA,WAAA,GAAA;AAcU,QAAA,IAAA,CAAA,kBAAkB,GAAG,MAAM,CAAC,iBAAiB,CAAC;;QAG7C,IAAA,CAAA,IAAI,GAAkB,SAAS;;QAG/B,IAAA,CAAA,KAAK,GAAiB,SAAS;;QAG/B,IAAA,CAAA,IAAI,GAA0C,eAAe;;QAG7D,IAAA,CAAA,WAAW,GAAG,CAAC;;QAGf,IAAA,CAAA,QAAQ,GAAG,EAAE;;QAGb,IAAA,CAAA,WAAW,GAAG,CAAC;;QAGf,IAAA,CAAA,KAAK,GAAG,CAAC;;QAGsB,IAAA,CAAA,OAAO,GAAG,IAAI;;QAGd,IAAA,CAAA,WAAW,GAAG,IAAI;AAC3D,IAAA;kIA7BY,SAAS,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;sHAAT,SAAS,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,KAAA,EAAA,OAAA,EAAA,IAAA,EAAA,MAAA,EAAA,WAAA,EAAA,aAAA,EAAA,QAAA,EAAA,UAAA,EAAA,WAAA,EAAA,aAAA,EAAA,KAAA,EAAA,OAAA,EAAA,OAAA,EAAA,CAAA,SAAA,EAAA,SAAA,EAyBA,gBAAgB,CAAA,EAAA,WAAA,EAAA,CAAA,aAAA,EAAA,aAAA,EAGhB,gBAAgB,qJCxDtC,ynBAyBA,EAAA,MAAA,EAAA,CAAA,kkBAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDCY,kBAAkB,EAAA,QAAA,EAAA,mCAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,MAAA,EAAA,OAAA,EAAA,UAAA,EAAA,aAAA,CAAA,EAAA,QAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAE,cAAc,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,OAAA,EAAA,aAAA,EAAA,MAAA,CAAA,EAAA,OAAA,EAAA,CAAA,cAAA,CAAA,EAAA,QAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FAEjC,SAAS,EAAA,UAAA,EAAA,CAAA;kBAbrB,SAAS;+BACE,YAAY,EAAA,QAAA,EACZ,WAAW,EAAA,IAAA,EACf;AACJ,wBAAA,OAAO,EAAE,YAAY;AACrB,wBAAA,4BAA4B,EAAE,SAAS;AACxC,qBAAA,EAAA,aAAA,EAGc,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,OAAA,EACtC,CAAC,kBAAkB,EAAE,cAAc,CAAC,EAAA,QAAA,EAAA,ynBAAA,EAAA,MAAA,EAAA,CAAA,kkBAAA,CAAA,EAAA;;sBAM5C;;sBAGA;;sBAGA;;sBAGA;;sBAGA;;sBAGA;;sBAGA;;sBAGA,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;;sBAGrC,KAAK;uBAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE;;;ME7C3B,eAAe,CAAA;kIAAf,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;mIAAf,eAAe,EAAA,OAAA,EAAA,CAHhB,YAAY,EAAE,wBAAwB,EAAE,oBAAoB,EAAE,SAAS,CAAA,EAAA,OAAA,EAAA,CACvE,SAAS,CAAA,EAAA,CAAA,CAAA;AAER,uBAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,eAAe,YAHhB,YAAY,EAAE,wBAAwB,EAAE,oBAAoB,EAAE,SAAS,CAAA,EAAA,CAAA,CAAA;;4FAGtE,eAAe,EAAA,UAAA,EAAA,CAAA;kBAJ3B,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,OAAO,EAAE,CAAC,YAAY,EAAE,wBAAwB,EAAE,oBAAoB,EAAE,SAAS,CAAC;oBAClF,OAAO,EAAE,CAAC,SAAS,CAAC;AACrB,iBAAA;;;ACVD;;AAEG;;;;"}
|
|
@@ -39,10 +39,10 @@ class MtxPhotoviewer {
|
|
|
39
39
|
initPhotoViewer() {
|
|
40
40
|
this.photoviewerInstance = new PhotoViewer(this.images, this.options);
|
|
41
41
|
}
|
|
42
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
43
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "21.2.
|
|
42
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPhotoviewer, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
43
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "21.2.11", type: MtxPhotoviewer, isStandalone: true, selector: "[mtxPhotoviewer]", inputs: { images: ["mtxPhotoviewerItems", "images"], options: ["mtxPhotoviewerOptions", "options"], embed: ["mtxPhotoviewerEmbed", "embed", booleanAttribute] }, host: { listeners: { "click": "onClick($event)" } }, exportAs: ["mtxPhotoviewer"], ngImport: i0 }); }
|
|
44
44
|
}
|
|
45
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
45
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPhotoviewer, decorators: [{
|
|
46
46
|
type: Directive,
|
|
47
47
|
args: [{
|
|
48
48
|
selector: '[mtxPhotoviewer]',
|
|
@@ -63,11 +63,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImpor
|
|
|
63
63
|
}] } });
|
|
64
64
|
|
|
65
65
|
class MtxPhotoviewerModule {
|
|
66
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
67
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.
|
|
68
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.
|
|
66
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPhotoviewerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
67
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.11", ngImport: i0, type: MtxPhotoviewerModule, imports: [MtxPhotoviewer], exports: [MtxPhotoviewer] }); }
|
|
68
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPhotoviewerModule }); }
|
|
69
69
|
}
|
|
70
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
70
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPhotoviewerModule, decorators: [{
|
|
71
71
|
type: NgModule,
|
|
72
72
|
args: [{
|
|
73
73
|
imports: [MtxPhotoviewer],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mtxPhotoviewer.mjs","sources":["../../../projects/extensions/photoviewer/photoviewer.ts","../../../projects/extensions/photoviewer/photoviewer-module.ts","../../../projects/extensions/photoviewer/mtxPhotoviewer.ts"],"sourcesContent":["import {\n Directive,\n ElementRef,\n Input,\n OnDestroy,\n OnInit,\n booleanAttribute,\n inject,\n} from '@angular/core';\nimport PhotoViewer from 'photoviewer';\n\n@Directive({\n selector: '[mtxPhotoviewer]',\n exportAs: 'mtxPhotoviewer',\n host: {\n '(click)': 'onClick($event)',\n },\n})\nexport class MtxPhotoviewer implements OnInit, OnDestroy {\n private _elementRef = inject<ElementRef<Element>>(ElementRef);\n\n @Input('mtxPhotoviewerItems')\n images: PhotoViewer.Img[] = [];\n\n @Input('mtxPhotoviewerOptions')\n options?: PhotoViewer.Options;\n\n @Input({ alias: 'mtxPhotoviewerEmbed', transform: booleanAttribute })\n embed = false;\n\n photoviewerInstance?: PhotoViewer;\n\n ngOnInit(): void {\n const { nativeElement } = this._elementRef;\n\n if (this.embed) {\n this.options = {\n appendTo: nativeElement,\n positionFixed: false,\n modalWidth: nativeElement.clientWidth,\n modalHeight: nativeElement.clientHeight,\n ...this.options,\n };\n this.initPhotoViewer();\n } else {\n if (this.images.length === 0 && nativeElement.nodeName === 'IMG') {\n const img = nativeElement as HTMLImageElement;\n this.images = [{ title: img.title || img.alt, src: img.src }];\n }\n }\n }\n\n ngOnDestroy(): void {\n this.photoviewerInstance?.close();\n }\n\n onClick(event: MouseEvent) {\n event.preventDefault();\n\n if (!this.embed) {\n this.initPhotoViewer();\n }\n }\n\n initPhotoViewer() {\n this.photoviewerInstance = new PhotoViewer(this.images, this.options);\n }\n}\n","import { NgModule } from '@angular/core';\nimport { MtxPhotoviewer } from './photoviewer';\n\n@NgModule({\n imports: [MtxPhotoviewer],\n exports: [MtxPhotoviewer],\n})\nexport class MtxPhotoviewerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAkBa,cAAc,CAAA;AAP3B,IAAA,WAAA,GAAA;AAQU,QAAA,IAAA,CAAA,WAAW,GAAG,MAAM,CAAsB,UAAU,CAAC;QAG7D,IAAA,CAAA,MAAM,GAAsB,EAAE;QAM9B,IAAA,CAAA,KAAK,GAAG,KAAK;AAuCd,IAAA;IAnCC,QAAQ,GAAA;AACN,QAAA,MAAM,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,WAAW;AAE1C,QAAA,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,IAAI,CAAC,OAAO,GAAG;AACb,gBAAA,QAAQ,EAAE,aAAa;AACvB,gBAAA,aAAa,EAAE,KAAK;gBACpB,UAAU,EAAE,aAAa,CAAC,WAAW;gBACrC,WAAW,EAAE,aAAa,CAAC,YAAY;gBACvC,GAAG,IAAI,CAAC,OAAO;aAChB;YACD,IAAI,CAAC,eAAe,EAAE;QACxB;aAAO;AACL,YAAA,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,IAAI,aAAa,CAAC,QAAQ,KAAK,KAAK,EAAE;gBAChE,MAAM,GAAG,GAAG,aAAiC;gBAC7C,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE,KAAK,EAAE,GAAG,CAAC,KAAK,IAAI,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,GAAG,EAAE,CAAC;YAC/D;QACF;IACF;IAEA,WAAW,GAAA;AACT,QAAA,IAAI,CAAC,mBAAmB,EAAE,KAAK,EAAE;IACnC;AAEA,IAAA,OAAO,CAAC,KAAiB,EAAA;QACvB,KAAK,CAAC,cAAc,EAAE;AAEtB,QAAA,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACf,IAAI,CAAC,eAAe,EAAE;QACxB;IACF;IAEA,eAAe,GAAA;AACb,QAAA,IAAI,CAAC,mBAAmB,GAAG,IAAI,WAAW,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,OAAO,CAAC;IACvE;
|
|
1
|
+
{"version":3,"file":"mtxPhotoviewer.mjs","sources":["../../../projects/extensions/photoviewer/photoviewer.ts","../../../projects/extensions/photoviewer/photoviewer-module.ts","../../../projects/extensions/photoviewer/mtxPhotoviewer.ts"],"sourcesContent":["import {\n Directive,\n ElementRef,\n Input,\n OnDestroy,\n OnInit,\n booleanAttribute,\n inject,\n} from '@angular/core';\nimport PhotoViewer from 'photoviewer';\n\n@Directive({\n selector: '[mtxPhotoviewer]',\n exportAs: 'mtxPhotoviewer',\n host: {\n '(click)': 'onClick($event)',\n },\n})\nexport class MtxPhotoviewer implements OnInit, OnDestroy {\n private _elementRef = inject<ElementRef<Element>>(ElementRef);\n\n @Input('mtxPhotoviewerItems')\n images: PhotoViewer.Img[] = [];\n\n @Input('mtxPhotoviewerOptions')\n options?: PhotoViewer.Options;\n\n @Input({ alias: 'mtxPhotoviewerEmbed', transform: booleanAttribute })\n embed = false;\n\n photoviewerInstance?: PhotoViewer;\n\n ngOnInit(): void {\n const { nativeElement } = this._elementRef;\n\n if (this.embed) {\n this.options = {\n appendTo: nativeElement,\n positionFixed: false,\n modalWidth: nativeElement.clientWidth,\n modalHeight: nativeElement.clientHeight,\n ...this.options,\n };\n this.initPhotoViewer();\n } else {\n if (this.images.length === 0 && nativeElement.nodeName === 'IMG') {\n const img = nativeElement as HTMLImageElement;\n this.images = [{ title: img.title || img.alt, src: img.src }];\n }\n }\n }\n\n ngOnDestroy(): void {\n this.photoviewerInstance?.close();\n }\n\n onClick(event: MouseEvent) {\n event.preventDefault();\n\n if (!this.embed) {\n this.initPhotoViewer();\n }\n }\n\n initPhotoViewer() {\n this.photoviewerInstance = new PhotoViewer(this.images, this.options);\n }\n}\n","import { NgModule } from '@angular/core';\nimport { MtxPhotoviewer } from './photoviewer';\n\n@NgModule({\n imports: [MtxPhotoviewer],\n exports: [MtxPhotoviewer],\n})\nexport class MtxPhotoviewerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
package/fesm2022/mtxPopover.mjs
CHANGED
|
@@ -2,7 +2,7 @@ import { CdkTrapFocus, FocusMonitor, isFakeMousedownFromScreenReader, A11yModule
|
|
|
2
2
|
import { Overlay, OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
|
|
3
3
|
import { CommonModule } from '@angular/common';
|
|
4
4
|
import * as i0 from '@angular/core';
|
|
5
|
-
import { InjectionToken,
|
|
5
|
+
import { InjectionToken, inject, TemplateRef, ApplicationRef, Injector, ViewContainerRef, DOCUMENT, ChangeDetectorRef, Directive, ElementRef, NgZone, EventEmitter, booleanAttribute, ContentChild, ViewChild, Output, Input, ViewEncapsulation, ChangeDetectionStrategy, Component, NgModule } from '@angular/core';
|
|
6
6
|
import { ESCAPE, hasModifierKey, ENTER, SPACE } from '@angular/cdk/keycodes';
|
|
7
7
|
import { _animationsDisabled } from '@angular/material/core';
|
|
8
8
|
import { Subject, Subscription, of, merge } from 'rxjs';
|
|
@@ -17,13 +17,13 @@ import { filter, take } from 'rxjs/operators';
|
|
|
17
17
|
*/
|
|
18
18
|
const MTX_POPOVER_CONTENT = new InjectionToken('MtxPopoverContent');
|
|
19
19
|
class _MtxPopoverContentBase {
|
|
20
|
-
constructor(
|
|
21
|
-
this._template =
|
|
22
|
-
this._appRef =
|
|
23
|
-
this._injector =
|
|
24
|
-
this._viewContainerRef =
|
|
25
|
-
this._document =
|
|
26
|
-
this._changeDetectorRef =
|
|
20
|
+
constructor() {
|
|
21
|
+
this._template = inject(TemplateRef);
|
|
22
|
+
this._appRef = inject(ApplicationRef);
|
|
23
|
+
this._injector = inject(Injector);
|
|
24
|
+
this._viewContainerRef = inject(ViewContainerRef);
|
|
25
|
+
this._document = inject(DOCUMENT);
|
|
26
|
+
this._changeDetectorRef = inject(ChangeDetectorRef);
|
|
27
27
|
/** Emits when the popover content has been attached. */
|
|
28
28
|
this._attached = new Subject();
|
|
29
29
|
}
|
|
@@ -49,10 +49,7 @@ class _MtxPopoverContentBase {
|
|
|
49
49
|
// by Angular. This causes the `@ContentChildren` for popover items within the popover to
|
|
50
50
|
// not be updated by Angular. By explicitly marking for check here, we tell Angular that
|
|
51
51
|
// it needs to check for new popover items and update the `@ContentChild` in `MtxPopover`.
|
|
52
|
-
|
|
53
|
-
if (this._changeDetectorRef) {
|
|
54
|
-
this._changeDetectorRef.markForCheck();
|
|
55
|
-
}
|
|
52
|
+
this._changeDetectorRef.markForCheck();
|
|
56
53
|
this._portal.attach(this._outlet, context);
|
|
57
54
|
this._attached.next();
|
|
58
55
|
}
|
|
@@ -70,23 +67,20 @@ class _MtxPopoverContentBase {
|
|
|
70
67
|
this._outlet.dispose();
|
|
71
68
|
}
|
|
72
69
|
}
|
|
73
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
74
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
70
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: _MtxPopoverContentBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
71
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.11", type: _MtxPopoverContentBase, isStandalone: true, ngImport: i0 }); }
|
|
75
72
|
}
|
|
76
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
73
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: _MtxPopoverContentBase, decorators: [{
|
|
77
74
|
type: Directive
|
|
78
|
-
}]
|
|
79
|
-
type: Inject,
|
|
80
|
-
args: [DOCUMENT]
|
|
81
|
-
}] }, { type: i0.ChangeDetectorRef }] });
|
|
75
|
+
}] });
|
|
82
76
|
/**
|
|
83
77
|
* Popover content that will be rendered lazily once the popover is opened.
|
|
84
78
|
*/
|
|
85
79
|
class MtxPopoverContent extends _MtxPopoverContentBase {
|
|
86
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
87
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
80
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPopoverContent, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
81
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.11", type: MtxPopoverContent, isStandalone: true, selector: "ng-template[mtxPopoverContent]", providers: [{ provide: MTX_POPOVER_CONTENT, useExisting: MtxPopoverContent }], usesInheritance: true, ngImport: i0 }); }
|
|
88
82
|
}
|
|
89
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
83
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPopoverContent, decorators: [{
|
|
90
84
|
type: Directive,
|
|
91
85
|
args: [{
|
|
92
86
|
selector: 'ng-template[mtxPopoverContent]',
|
|
@@ -391,10 +385,10 @@ class MtxPopover {
|
|
|
391
385
|
}
|
|
392
386
|
this._changeDetectorRef.markForCheck();
|
|
393
387
|
}
|
|
394
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
395
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.
|
|
388
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPopover, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
389
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: MtxPopover, isStandalone: true, 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", hideArrow: ["hideArrow", "hideArrow", booleanAttribute], closeOnPanelClick: ["closeOnPanelClick", "closeOnPanelClick", booleanAttribute], closeOnBackdropClick: ["closeOnBackdropClick", "closeOnBackdropClick", booleanAttribute], focusTrapEnabled: ["focusTrapEnabled", "focusTrapEnabled", booleanAttribute], focusTrapAutoCaptureEnabled: ["focusTrapAutoCaptureEnabled", "focusTrapAutoCaptureEnabled", booleanAttribute], hasBackdrop: ["hasBackdrop", "hasBackdrop", booleanAttribute], 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>\n <!-- eslint-disable @angular-eslint/template/mouse-events-have-key-events -->\n <div\n [id]=\"panelId\"\n class=\"mtx-popover-panel\"\n [class]=\"_classList\"\n [class.mtx-popover-panel-animations-disabled]=\"_animationsDisabled\"\n [class.mtx-popover-panel-exit-animation]=\"_panelAnimationState === 'void'\"\n [class.mtx-popover-panel-animating]=\"_isAnimating\"\n [class.mtx-popover-panel-without-arrow]=\"hideArrow\"\n (keydown)=\"_handleKeydown($event)\"\n (click)=\"_handleClick()\"\n (mouseover)=\"_handleMouseOver()\"\n (mouseleave)=\"_handleMouseLeave()\"\n tabindex=\"-1\"\n role=\"dialog\"\n (animationstart)=\"_onAnimationStart($event.animationName)\"\n (animationend)=\"_onAnimationDone($event.animationName)\"\n (animationcancel)=\"_onAnimationDone($event.animationName)\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\n [attr.aria-describedby]=\"ariaDescribedby || null\"\n [cdkTrapFocus]=\"focusTrapEnabled\"\n [cdkTrapFocusAutoCapture]=\"focusTrapAutoCaptureEnabled\"\n >\n <div class=\"mtx-popover-content\">\n <ng-content></ng-content>\n </div>\n @if (!hideArrow) {\n <div class=\"mtx-popover-direction-arrow\" [style]=\"arrowStyles\"></div>\n }\n </div>\n</ng-template>\n", styles: ["@keyframes _mtx-popover-enter{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}@keyframes _mtx-popover-exit{0%{opacity:1}to{opacity:0}}.mtx-popover-panel{position:relative;max-height:calc(100vh - 48px);padding:8px;font-size:inherit;outline:0;animation:_mtx-popover-enter .12s cubic-bezier(0,0,.2,1);border-radius:var(--mtx-popover-container-shape, var(--mat-sys-corner-extra-small));background-color:var(--mtx-popover-background-color, var(--mat-sys-surface-container));color:var(--mtx-popover-text-color, var(--mat-sys-on-surface))}.mtx-popover-panel.mtx-popover-panel-exit-animation{animation:_mtx-popover-exit .1s 25ms linear forwards}.mtx-popover-panel.mtx-popover-panel-animations-disabled{animation:none}.mtx-popover-panel.mtx-popover-panel-animating{pointer-events:none}.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-panel.mtx-popover-panel-without-arrow{margin:0}.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:before{border-color:var(--mtx-popover-outline-color, var(--mat-sys-surface-container))}.mtx-popover-direction-arrow:after{border-width:calc(.5em - 1px);border-color:var(--mtx-popover-background-color, var(--mat-sys-surface-container))}[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:before,[class*=mtx-popover-below] .mtx-popover-direction-arrow:after,[class*=mtx-popover-above] .mtx-popover-direction-arrow:before,[class*=mtx-popover-above] .mtx-popover-direction-arrow:after{border-left-color:transparent;border-right-color:transparent}[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:before,[class*=mtx-popover-before] .mtx-popover-direction-arrow:after,[class*=mtx-popover-after] .mtx-popover-direction-arrow:before,[class*=mtx-popover-after] .mtx-popover-direction-arrow:after{border-top-color:transparent;border-bottom-color:transparent}[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: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
396
390
|
}
|
|
397
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
391
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPopover, decorators: [{
|
|
398
392
|
type: Component,
|
|
399
393
|
args: [{ selector: 'mtx-popover', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, exportAs: 'mtxPopover', imports: [CdkTrapFocus], template: "<ng-template>\n <!-- eslint-disable @angular-eslint/template/mouse-events-have-key-events -->\n <div\n [id]=\"panelId\"\n class=\"mtx-popover-panel\"\n [class]=\"_classList\"\n [class.mtx-popover-panel-animations-disabled]=\"_animationsDisabled\"\n [class.mtx-popover-panel-exit-animation]=\"_panelAnimationState === 'void'\"\n [class.mtx-popover-panel-animating]=\"_isAnimating\"\n [class.mtx-popover-panel-without-arrow]=\"hideArrow\"\n (keydown)=\"_handleKeydown($event)\"\n (click)=\"_handleClick()\"\n (mouseover)=\"_handleMouseOver()\"\n (mouseleave)=\"_handleMouseLeave()\"\n tabindex=\"-1\"\n role=\"dialog\"\n (animationstart)=\"_onAnimationStart($event.animationName)\"\n (animationend)=\"_onAnimationDone($event.animationName)\"\n (animationcancel)=\"_onAnimationDone($event.animationName)\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\n [attr.aria-describedby]=\"ariaDescribedby || null\"\n [cdkTrapFocus]=\"focusTrapEnabled\"\n [cdkTrapFocusAutoCapture]=\"focusTrapAutoCaptureEnabled\"\n >\n <div class=\"mtx-popover-content\">\n <ng-content></ng-content>\n </div>\n @if (!hideArrow) {\n <div class=\"mtx-popover-direction-arrow\" [style]=\"arrowStyles\"></div>\n }\n </div>\n</ng-template>\n", styles: ["@keyframes _mtx-popover-enter{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}@keyframes _mtx-popover-exit{0%{opacity:1}to{opacity:0}}.mtx-popover-panel{position:relative;max-height:calc(100vh - 48px);padding:8px;font-size:inherit;outline:0;animation:_mtx-popover-enter .12s cubic-bezier(0,0,.2,1);border-radius:var(--mtx-popover-container-shape, var(--mat-sys-corner-extra-small));background-color:var(--mtx-popover-background-color, var(--mat-sys-surface-container));color:var(--mtx-popover-text-color, var(--mat-sys-on-surface))}.mtx-popover-panel.mtx-popover-panel-exit-animation{animation:_mtx-popover-exit .1s 25ms linear forwards}.mtx-popover-panel.mtx-popover-panel-animations-disabled{animation:none}.mtx-popover-panel.mtx-popover-panel-animating{pointer-events:none}.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-panel.mtx-popover-panel-without-arrow{margin:0}.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:before{border-color:var(--mtx-popover-outline-color, var(--mat-sys-surface-container))}.mtx-popover-direction-arrow:after{border-width:calc(.5em - 1px);border-color:var(--mtx-popover-background-color, var(--mat-sys-surface-container))}[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:before,[class*=mtx-popover-below] .mtx-popover-direction-arrow:after,[class*=mtx-popover-above] .mtx-popover-direction-arrow:before,[class*=mtx-popover-above] .mtx-popover-direction-arrow:after{border-left-color:transparent;border-right-color:transparent}[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:before,[class*=mtx-popover-before] .mtx-popover-direction-arrow:after,[class*=mtx-popover-after] .mtx-popover-direction-arrow:before,[class*=mtx-popover-after] .mtx-popover-direction-arrow:after{border-top-color:transparent;border-bottom-color:transparent}[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"] }]
|
|
400
394
|
}], propDecorators: { backdropClass: [{
|
|
@@ -465,10 +459,10 @@ class MtxPopoverTarget {
|
|
|
465
459
|
constructor() {
|
|
466
460
|
this.elementRef = inject(ElementRef);
|
|
467
461
|
}
|
|
468
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
469
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
462
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPopoverTarget, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
463
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.11", type: MtxPopoverTarget, isStandalone: true, selector: "mtx-popover-target, [mtxPopoverTarget]", exportAs: ["mtxPopoverTarget"], ngImport: i0 }); }
|
|
470
464
|
}
|
|
471
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
465
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPopoverTarget, decorators: [{
|
|
472
466
|
type: Directive,
|
|
473
467
|
args: [{
|
|
474
468
|
selector: 'mtx-popover-target, [mtxPopoverTarget]',
|
|
@@ -886,10 +880,10 @@ class MtxPopoverTrigger {
|
|
|
886
880
|
}
|
|
887
881
|
return this._portal;
|
|
888
882
|
}
|
|
889
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
890
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.
|
|
883
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPopoverTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
884
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.11", type: MtxPopoverTrigger, isStandalone: true, 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", "attr.aria-controls": "popoverOpen ? popover.panelId : null" } }, exportAs: ["mtxPopoverTrigger"], ngImport: i0 }); }
|
|
891
885
|
}
|
|
892
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
886
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPopoverTrigger, decorators: [{
|
|
893
887
|
type: Directive,
|
|
894
888
|
args: [{
|
|
895
889
|
selector: '[mtx-popover-trigger-for], [mtxPopoverTriggerFor]',
|
|
@@ -924,19 +918,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImpor
|
|
|
924
918
|
}] } });
|
|
925
919
|
|
|
926
920
|
class MtxPopoverModule {
|
|
927
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.
|
|
928
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.
|
|
921
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
922
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.11", ngImport: i0, type: MtxPopoverModule, imports: [CommonModule,
|
|
929
923
|
OverlayModule,
|
|
930
924
|
A11yModule,
|
|
931
925
|
MtxPopover,
|
|
932
926
|
MtxPopoverTrigger,
|
|
933
927
|
MtxPopoverTarget,
|
|
934
928
|
MtxPopoverContent], exports: [MtxPopover, MtxPopoverTrigger, MtxPopoverTarget, MtxPopoverContent] }); }
|
|
935
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.
|
|
929
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPopoverModule, imports: [CommonModule,
|
|
936
930
|
OverlayModule,
|
|
937
931
|
A11yModule] }); }
|
|
938
932
|
}
|
|
939
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.
|
|
933
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: MtxPopoverModule, decorators: [{
|
|
940
934
|
type: NgModule,
|
|
941
935
|
args: [{
|
|
942
936
|
imports: [
|