@ng-matero/extensions 15.0.2 → 15.0.4
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/esm2020/alert/alert-module.mjs +4 -4
- package/esm2020/alert/alert.mjs +3 -3
- package/esm2020/button/button-loading.mjs +3 -3
- 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 +3 -3
- package/esm2020/colorpicker/colorpicker-input.mjs +3 -3
- package/esm2020/colorpicker/colorpicker-module.mjs +4 -4
- package/esm2020/colorpicker/colorpicker-toggle.mjs +6 -6
- package/esm2020/colorpicker/colorpicker.mjs +6 -6
- 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/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 +3 -3
- package/esm2020/datetimepicker/clock.mjs +3 -3
- package/esm2020/datetimepicker/datetimepicker-input.mjs +3 -3
- package/esm2020/datetimepicker/datetimepicker-intl.mjs +3 -3
- package/esm2020/datetimepicker/datetimepicker-module.mjs +4 -4
- package/esm2020/datetimepicker/datetimepicker-toggle.mjs +6 -6
- package/esm2020/datetimepicker/datetimepicker.mjs +6 -6
- package/esm2020/datetimepicker/month-view.mjs +3 -3
- package/esm2020/datetimepicker/multi-year-view.mjs +3 -3
- package/esm2020/datetimepicker/time.mjs +6 -6
- 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 +3 -3
- package/esm2020/drawer/drawer-module.mjs +4 -4
- package/esm2020/drawer/drawer.mjs +3 -3
- package/esm2020/grid/cell.mjs +3 -3
- 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 +3 -3
- package/esm2020/grid/column-resize/resize-strategy.mjs +3 -3
- package/esm2020/grid/expansion-toggle.mjs +3 -3
- package/esm2020/grid/grid-module.mjs +4 -4
- package/esm2020/grid/grid-utils.mjs +3 -3
- package/esm2020/grid/grid.mjs +7 -7
- package/esm2020/loader/loader-module.mjs +4 -4
- package/esm2020/loader/loader.mjs +3 -3
- 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 +3 -3
- package/esm2020/popover/popover.mjs +3 -3
- package/esm2020/progress/progress-module.mjs +4 -4
- package/esm2020/progress/progress.mjs +3 -3
- package/esm2020/select/option.mjs +3 -3
- package/esm2020/select/select-module.mjs +4 -4
- package/esm2020/select/select.mjs +7 -7
- package/esm2020/select/templates.mjs +33 -33
- package/esm2020/slider/slider-module.mjs +4 -4
- package/esm2020/slider/slider.mjs +3 -3
- package/esm2020/split/split-module.mjs +4 -4
- package/esm2020/split/split-pane.mjs +3 -3
- package/esm2020/split/split.mjs +3 -3
- package/esm2020/tooltip/tooltip-module.mjs +4 -4
- package/esm2020/tooltip/tooltip.mjs +6 -6
- package/fesm2015/mtxAlert.mjs +7 -7
- package/fesm2015/mtxButton.mjs +7 -7
- package/fesm2015/mtxCheckboxGroup.mjs +7 -7
- package/fesm2015/mtxColorpicker.mjs +19 -19
- package/fesm2015/mtxColumnResize.mjs +40 -40
- package/fesm2015/mtxCore.mjs +18 -18
- package/fesm2015/mtxDatetimepicker.mjs +46 -46
- package/fesm2015/mtxDialog.mjs +10 -10
- package/fesm2015/mtxDrawer.mjs +10 -10
- package/fesm2015/mtxGrid.mjs +46 -46
- package/fesm2015/mtxGrid.mjs.map +1 -1
- package/fesm2015/mtxLoader.mjs +7 -7
- package/fesm2015/mtxPopover.mjs +19 -19
- package/fesm2015/mtxProgress.mjs +7 -7
- package/fesm2015/mtxSelect.mjs +47 -47
- package/fesm2015/mtxSelect.mjs.map +1 -1
- package/fesm2015/mtxSlider.mjs +7 -7
- package/fesm2015/mtxSplit.mjs +10 -10
- package/fesm2015/mtxTooltip.mjs +10 -10
- package/fesm2020/mtxAlert.mjs +7 -7
- package/fesm2020/mtxButton.mjs +7 -7
- package/fesm2020/mtxCheckboxGroup.mjs +7 -7
- package/fesm2020/mtxColorpicker.mjs +19 -19
- package/fesm2020/mtxColumnResize.mjs +40 -40
- package/fesm2020/mtxCore.mjs +18 -18
- package/fesm2020/mtxDatetimepicker.mjs +46 -46
- package/fesm2020/mtxDialog.mjs +10 -10
- package/fesm2020/mtxDrawer.mjs +10 -10
- package/fesm2020/mtxGrid.mjs +46 -46
- package/fesm2020/mtxGrid.mjs.map +1 -1
- package/fesm2020/mtxLoader.mjs +7 -7
- package/fesm2020/mtxPopover.mjs +19 -19
- package/fesm2020/mtxProgress.mjs +7 -7
- package/fesm2020/mtxSelect.mjs +46 -47
- package/fesm2020/mtxSelect.mjs.map +1 -1
- package/fesm2020/mtxSlider.mjs +7 -7
- package/fesm2020/mtxSplit.mjs +10 -10
- package/fesm2020/mtxTooltip.mjs +10 -10
- package/grid/grid.scss +2 -2
- package/package.json +1 -1
- package/select/select.d.ts +1 -1
|
@@ -128,9 +128,9 @@ class MtxCalendarBody {
|
|
|
128
128
|
return cellNumber === this.activeCell;
|
|
129
129
|
}
|
|
130
130
|
}
|
|
131
|
-
/** @nocollapse */ MtxCalendarBody.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
132
|
-
/** @nocollapse */ MtxCalendarBody.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
133
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
131
|
+
/** @nocollapse */ MtxCalendarBody.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxCalendarBody, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
132
|
+
/** @nocollapse */ MtxCalendarBody.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MtxCalendarBody, selector: "[mtx-calendar-body]", inputs: { label: "label", rows: "rows", todayValue: "todayValue", selectedValue: "selectedValue", labelMinRequiredCells: "labelMinRequiredCells", numCols: "numCols", allowDisabledSelection: "allowDisabledSelection", activeCell: "activeCell" }, outputs: { selectedValueChange: "selectedValueChange" }, host: { classAttribute: "mtx-calendar-body" }, exportAs: ["mtxCalendarBody"], ngImport: i0, template: "<!--\n If there's not enough space in the first row, create a separate label row. We mark this row as\n aria-hidden because we don't want it to be read out as one of the weeks in the month.\n-->\n<tr *ngIf=\"_firstRowOffset < labelMinRequiredCells\" aria-hidden=\"true\">\n <td class=\"mtx-calendar-body-label\" [attr.colspan]=\"numCols\">{{ label }}</td>\n</tr>\n\n<!-- Create the first row separately so we can include a special spacer cell. -->\n<tr *ngFor=\"let row of rows; let rowIndex = index\" role=\"row\">\n <!--\n We mark this cell as aria-hidden so it doesn't get read out as one of the days in the week.\n -->\n <td *ngIf=\"rowIndex === 0 && _firstRowOffset\"\n class=\"mtx-calendar-body-label\" [attr.colspan]=\"_firstRowOffset\" aria-hidden=\"true\">\n {{ _firstRowOffset >= labelMinRequiredCells ? label : '' }}\n </td>\n <td *ngFor=\"let item of row; let colIndex = index\"\n role=\"gridcell\"\n class=\"mtx-calendar-body-cell\"\n [class.mtx-calendar-body-active]=\"_isActiveCell(rowIndex, colIndex)\"\n [class.mtx-calendar-body-disabled]=\"!item.enabled\"\n [tabindex]=\"_isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n [attr.data-mat-row]=\"rowIndex\"\n [attr.data-mat-col]=\"colIndex\"\n [attr.aria-label]=\"item.ariaLabel\"\n [attr.aria-disabled]=\"!item.enabled || null\"\n (click)=\"_cellClicked(item)\">\n <div class=\"mtx-calendar-body-cell-content\"\n [class.mtx-calendar-body-selected]=\"selectedValue === item.value\"\n [class.mtx-calendar-body-today]=\"todayValue === item.value\"\n [attr.aria-selected]=\"selectedValue === item.value\">\n {{ item.displayValue }}\n </div>\n </td>\n</tr>\n", styles: [".mtx-calendar-body{min-width:224px}.mtx-calendar-body-label{height:0;line-height:0;text-align:left;padding:7.1428571429% 4.7142857143%}[dir=rtl] .mtx-calendar-body-label{text-align:right}.mtx-calendar-body-cell{position:relative;width:14.2857142857%;height:0;line-height:0;padding:7.1428571429% 0;text-align:center;outline:none;cursor:pointer}.mtx-calendar-body-disabled{cursor:default;pointer-events:none}.mtx-calendar-body-cell-content{position:absolute;top:5%;left:5%;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:90%;height:90%;border:1px solid transparent;border-radius:999px}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
133
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxCalendarBody, decorators: [{
|
|
134
134
|
type: Component,
|
|
135
135
|
args: [{ selector: '[mtx-calendar-body]', host: {
|
|
136
136
|
class: 'mtx-calendar-body',
|
|
@@ -296,9 +296,9 @@ class MtxMultiYearView {
|
|
|
296
296
|
return this._adapter.isDateInstance(obj) && this._adapter.isValid(obj) ? obj : null;
|
|
297
297
|
}
|
|
298
298
|
}
|
|
299
|
-
/** @nocollapse */ MtxMultiYearView.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
300
|
-
/** @nocollapse */ MtxMultiYearView.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
301
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
299
|
+
/** @nocollapse */ MtxMultiYearView.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxMultiYearView, deps: [{ token: i1.DatetimeAdapter, optional: true }, { token: MTX_DATETIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
300
|
+
/** @nocollapse */ MtxMultiYearView.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MtxMultiYearView, selector: "mtx-multi-year-view", inputs: { type: "type", dateFilter: "dateFilter", activeDate: "activeDate", selected: "selected", minDate: "minDate", maxDate: "maxDate" }, outputs: { selectedChange: "selectedChange", _userSelection: "_userSelection" }, exportAs: ["mtxMultiYearView"], ngImport: i0, template: "<table class=\"mtx-calendar-table\" role=\"grid\">\n <thead class=\"mtx-calendar-table-header\"></thead>\n <tbody mtx-calendar-body\n (@slideCalendar.done)=\"_calendarStateDone()\"\n [@slideCalendar]=\"_calendarState\"\n [todayValue]=\"_todayYear\"\n [rows]=\"_years\"\n [numCols]=\"4\"\n [activeCell]=\"_getActiveCell()\"\n [allowDisabledSelection]=\"true\"\n [selectedValue]=\"_selectedYear!\"\n (selectedValueChange)=\"_yearSelected($event)\"></tbody>\n</table>\n", dependencies: [{ kind: "component", type: MtxCalendarBody, selector: "[mtx-calendar-body]", inputs: ["label", "rows", "todayValue", "selectedValue", "labelMinRequiredCells", "numCols", "allowDisabledSelection", "activeCell"], outputs: ["selectedValueChange"], exportAs: ["mtxCalendarBody"] }], animations: [mtxDatetimepickerAnimations.slideCalendar], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
301
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxMultiYearView, decorators: [{
|
|
302
302
|
type: Component,
|
|
303
303
|
args: [{ selector: 'mtx-multi-year-view', exportAs: 'mtxMultiYearView', animations: [mtxDatetimepickerAnimations.slideCalendar], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<table class=\"mtx-calendar-table\" role=\"grid\">\n <thead class=\"mtx-calendar-table-header\"></thead>\n <tbody mtx-calendar-body\n (@slideCalendar.done)=\"_calendarStateDone()\"\n [@slideCalendar]=\"_calendarState\"\n [todayValue]=\"_todayYear\"\n [rows]=\"_years\"\n [numCols]=\"4\"\n [activeCell]=\"_getActiveCell()\"\n [allowDisabledSelection]=\"true\"\n [selectedValue]=\"_selectedYear!\"\n (selectedValueChange)=\"_yearSelected($event)\"></tbody>\n</table>\n" }]
|
|
304
304
|
}], ctorParameters: function () { return [{ type: i1.DatetimeAdapter, decorators: [{
|
|
@@ -414,9 +414,9 @@ class MtxDatetimepickerIntl {
|
|
|
414
414
|
return `${start} to ${end}`;
|
|
415
415
|
}
|
|
416
416
|
}
|
|
417
|
-
/** @nocollapse */ MtxDatetimepickerIntl.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
418
|
-
/** @nocollapse */ MtxDatetimepickerIntl.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.
|
|
419
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
417
|
+
/** @nocollapse */ MtxDatetimepickerIntl.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerIntl, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
418
|
+
/** @nocollapse */ MtxDatetimepickerIntl.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerIntl, providedIn: 'root' });
|
|
419
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerIntl, decorators: [{
|
|
420
420
|
type: Injectable,
|
|
421
421
|
args: [{ providedIn: 'root' }]
|
|
422
422
|
}] });
|
|
@@ -705,9 +705,9 @@ class MtxClock {
|
|
|
705
705
|
this.activeDateChange.emit(this.activeDate);
|
|
706
706
|
}
|
|
707
707
|
}
|
|
708
|
-
/** @nocollapse */ MtxClock.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
709
|
-
/** @nocollapse */ MtxClock.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
710
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
708
|
+
/** @nocollapse */ MtxClock.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxClock, deps: [{ token: i0.ElementRef }, { token: i1.DatetimeAdapter }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
|
|
709
|
+
/** @nocollapse */ MtxClock.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MtxClock, selector: "mtx-clock", inputs: { dateFilter: "dateFilter", interval: "interval", twelvehour: "twelvehour", AMPM: "AMPM", activeDate: "activeDate", selected: "selected", minDate: "minDate", maxDate: "maxDate", startView: "startView" }, outputs: { selectedChange: "selectedChange", activeDateChange: "activeDateChange", _userSelection: "_userSelection" }, host: { attributes: { "role": "clock" }, listeners: { "mousedown": "_pointerDown($event)", "touchstart": "_pointerDown($event)" }, classAttribute: "mtx-clock" }, exportAs: ["mtxClock"], usesOnChanges: true, ngImport: i0, template: "<div class=\"mtx-clock-wrapper\">\n <div class=\"mtx-clock-center\"></div>\n <div class=\"mtx-clock-hand\" [ngStyle]=\"_hand\"></div>\n <div class=\"mtx-clock-hours\" [class.active]=\"_hourView\">\n <div *ngFor=\"let item of _hours\"\n class=\"mtx-clock-cell\"\n [class.mtx-clock-cell-disabled]=\"!item.enabled\"\n [class.mtx-clock-cell-selected]=\"_selectedHour === item.value\"\n [style.fontSize]=\"item.fontSize\"\n [style.left]=\"item.left+'%'\"\n [style.top]=\"item.top+'%'\">{{ item.displayValue }}</div>\n </div>\n <div class=\"mtx-clock-minutes\" [class.active]=\"!_hourView\">\n <div *ngFor=\"let item of _minutes\"\n class=\"mtx-clock-cell\"\n [class.mtx-clock-cell-disabled]=\"!item.enabled\"\n [class.mtx-clock-cell-selected]=\"_selectedMinute === item.value\"\n [style.left]=\"item.left+'%'\"\n [style.top]=\"item.top+'%'\">{{ item.displayValue }}</div>\n </div>\n</div>\n", styles: [".mtx-clock{position:relative;display:block;min-width:224px;margin:12px;box-sizing:border-box;-webkit-user-select:none;user-select:none;touch-action:none}.mtx-clock-wrapper{position:relative;width:100%;height:0;padding-top:100%;border-radius:50%}.mtx-clock-center{position:absolute;top:50%;left:50%;width:2%;height:2%;margin:-1%;border-radius:50%}.mtx-clock-hand{position:absolute;inset:0;width:1px;margin:0 auto;transform-origin:bottom}.mtx-clock-hand:before{content:\"\";position:absolute;top:-4px;left:-4px;width:8px;height:8px;border-radius:50%}.mtx-clock-hours,.mtx-clock-minutes{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;visibility:hidden;transition:.35s;transform:scale(1.2)}.mtx-clock-hours.active,.mtx-clock-minutes.active{opacity:1;visibility:visible;transform:scale(1)}.mtx-clock-minutes{transform:scale(.8)}.mtx-clock-cell{position:absolute;display:flex;width:14.1666%;height:14.1666%;justify-content:center;box-sizing:border-box;border-radius:50%;align-items:center;cursor:pointer}.mtx-clock-cell.mtx-clock-cell-disabled{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
710
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxClock, decorators: [{
|
|
711
711
|
type: Component,
|
|
712
712
|
args: [{ selector: 'mtx-clock', host: {
|
|
713
713
|
'role': 'clock',
|
|
@@ -921,9 +921,9 @@ class MtxTimeInput {
|
|
|
921
921
|
this.inputElement.removeEventListener('input', this.inputEventListener);
|
|
922
922
|
}
|
|
923
923
|
}
|
|
924
|
-
/** @nocollapse */ MtxTimeInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
925
|
-
/** @nocollapse */ MtxTimeInput.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.
|
|
926
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
924
|
+
/** @nocollapse */ MtxTimeInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxTimeInput, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
925
|
+
/** @nocollapse */ MtxTimeInput.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: MtxTimeInput, selector: "input.mtx-time-input", inputs: { timeInterval: "timeInterval", timeMin: "timeMin", timeMax: "timeMax", timeValue: "timeValue" }, outputs: { timeValueChanged: "timeValueChanged" }, host: { listeners: { "blur": "blur($event)", "focus": "focus($event)" } }, exportAs: ["mtxTimeInput"], ngImport: i0 });
|
|
926
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxTimeInput, decorators: [{
|
|
927
927
|
type: Directive,
|
|
928
928
|
args: [{
|
|
929
929
|
selector: 'input.mtx-time-input',
|
|
@@ -1161,9 +1161,9 @@ class MtxTime {
|
|
|
1161
1161
|
}
|
|
1162
1162
|
}
|
|
1163
1163
|
}
|
|
1164
|
-
/** @nocollapse */ MtxTime.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
1165
|
-
/** @nocollapse */ MtxTime.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
1166
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
1164
|
+
/** @nocollapse */ MtxTime.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxTime, deps: [{ token: i1.DatetimeAdapter }, { token: i0.ChangeDetectorRef }, { token: MtxDatetimepickerIntl }], target: i0.ɵɵFactoryTarget.Component });
|
|
1165
|
+
/** @nocollapse */ MtxTime.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MtxTime, selector: "mtx-time", inputs: { dateFilter: "dateFilter", interval: "interval", twelvehour: "twelvehour", AMPM: "AMPM", activeDate: "activeDate", selected: "selected", minDate: "minDate", maxDate: "maxDate", clockView: "clockView" }, outputs: { selectedChange: "selectedChange", activeDateChange: "activeDateChange", _userSelection: "_userSelection", ampmChange: "ampmChange", clockViewChange: "clockViewChange" }, host: { classAttribute: "mtx-time" }, viewQueries: [{ propertyName: "hourInputElement", first: true, predicate: ["hourInput"], descendants: true, read: (ElementRef) }, { propertyName: "hourInputDirective", first: true, predicate: ["hourInput"], descendants: true, read: MtxTimeInput }, { propertyName: "minuteInputElement", first: true, predicate: ["minuteInput"], descendants: true, read: (ElementRef) }, { propertyName: "minuteInputDirective", first: true, predicate: ["minuteInput"], descendants: true, read: MtxTimeInput }], exportAs: ["mtxTime"], usesOnChanges: true, ngImport: i0, template: "<div class=\"mtx-time-input-wrapper\">\n <div class=\"mtx-time-input-inner\">\n <input class=\"mtx-time-input\"\n [class.mtx-time-input-active]=\"clockView === 'hour'\"\n [class.mtx-time-input-warning]=\"!hourInput.valid\"\n #hourInput=\"mtxTimeInput\"\n type=\"text\"\n inputmode=\"numeric\"\n maxlength=\"2\"\n [timeMin]=\"twelvehour ? 1 : 0\"\n [timeMax]=\"twelvehour ? 12 : 23\"\n [timeValue]=\"hour\"\n (timeValueChanged)=\"handleHourInputChange($event)\"\n (focus)=\"handleFocus('hour')\" />\n\n <div class=\"mtx-time-seperator\">:</div>\n\n <input class=\"mtx-time-input\"\n [class.mtx-time-input-active]=\"clockView === 'minute'\"\n [class.mtx-time-input-warning]=\"!minuteInput.valid\"\n #minuteInput=\"mtxTimeInput\"\n type=\"text\"\n inputmode=\"numeric\"\n maxlength=\"2\"\n [timeMin]=\"0\"\n [timeMax]=\"59\"\n [timeValue]=\"minute\"\n (timeValueChanged)=\"handleMinuteInputChange($event)\"\n [timeInterval]=\"interval\"\n (focus)=\"handleFocus('minute')\" />\n\n <div *ngIf=\"twelvehour\" class=\"mtx-time-ampm\">\n <button mat-button type=\"button\" class=\"mtx-time-am\"\n [class.mtx-time-ampm-active]=\"AMPM === 'AM'\" aria-label=\"AM\"\n (keydown)=\"$event.stopPropagation()\"\n (click)=\"ampmChange.emit('AM')\">AM</button>\n <button mat-button type=\"button\" class=\"mtx-time-pm\"\n [class.mtx-time-ampm-active]=\"AMPM === 'PM'\" aria-label=\"PM\"\n (keydown)=\"$event.stopPropagation()\"\n (click)=\"ampmChange.emit('PM')\">PM</button>\n </div>\n </div>\n</div>\n\n<mtx-clock (selectedChange)=\"_timeSelected($event)\"\n (activeDateChange)=\"_onActiveDateChange($event)\"\n [AMPM]=\"AMPM\"\n [dateFilter]=\"dateFilter\"\n [interval]=\"interval\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [selected]=\"selected\"\n [startView]=\"clockView\"\n [twelvehour]=\"twelvehour\">\n</mtx-clock>\n\n<div class=\"mtx-time-button-wrapper\">\n <button class=\"mtx-time-cancel-button\" mat-button type=\"button\" (click)=\"handleCancel()\">\n {{ _datetimepickerIntl.cancelLabel }}\n </button>\n <button class=\"mtx-time-ok-button\" mat-button type=\"button\" (click)=\"handleOk()\"\n [disabled]=\"minuteInputDirective?.invalid || hourInputDirective?.invalid\">\n {{ _datetimepickerIntl.okLabel }}\n </button>\n</div>\n", styles: [".mtx-time{display:block;outline:none;-webkit-user-select:none;user-select:none}.mtx-time-input-wrapper{padding:8px 0;text-align:center}.mtx-time-input-inner{display:inline-flex;height:56px}.mtx-time-input{box-sizing:border-box;width:72px;height:100%;padding:0;font-size:36px;text-align:center;border-radius:8px;border:2px solid transparent;-webkit-appearance:none;appearance:none;outline:none}.mtx-time-seperator{display:inline-flex;justify-content:center;align-items:center;width:24px;font-size:36px}.mtx-time-ampm{display:inline-flex;flex-direction:column;margin-left:12px}[dir=rtl] .mtx-time-ampm{margin-left:auto;margin-right:12px}.mtx-time-ampm .mtx-time-am,.mtx-time-ampm .mtx-time-pm{flex:1;width:40px;min-width:auto;padding:0;line-height:normal;border-width:1px;border-style:solid}.mtx-time-ampm .mtx-time-am{border-radius:8px 8px 0 0}.mtx-time-ampm .mtx-time-pm{border-radius:0 0 8px 8px;border-top:none}.mtx-time-button-wrapper{display:flex;justify-content:flex-end;padding-top:8px}.mtx-time-button-wrapper .mat-mdc-button-base+.mat-mdc-button-base{margin-left:8px}[dir=rtl] .mtx-time-button-wrapper .mat-mdc-button-base+.mat-mdc-button-base{margin-left:0;margin-right:8px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: MtxClock, selector: "mtx-clock", inputs: ["dateFilter", "interval", "twelvehour", "AMPM", "activeDate", "selected", "minDate", "maxDate", "startView"], outputs: ["selectedChange", "activeDateChange", "_userSelection"], exportAs: ["mtxClock"] }, { kind: "directive", type: MtxTimeInput, selector: "input.mtx-time-input", inputs: ["timeInterval", "timeMin", "timeMax", "timeValue"], outputs: ["timeValueChanged"], exportAs: ["mtxTimeInput"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1166
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxTime, decorators: [{
|
|
1167
1167
|
type: Component,
|
|
1168
1168
|
args: [{ selector: 'mtx-time', exportAs: 'mtxTime', host: {
|
|
1169
1169
|
class: 'mtx-time',
|
|
@@ -1323,9 +1323,9 @@ class MtxMonthView {
|
|
|
1323
1323
|
this._calendarState = direction;
|
|
1324
1324
|
}
|
|
1325
1325
|
}
|
|
1326
|
-
/** @nocollapse */ MtxMonthView.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
1327
|
-
/** @nocollapse */ MtxMonthView.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
1328
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
1326
|
+
/** @nocollapse */ MtxMonthView.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxMonthView, deps: [{ token: i1.DatetimeAdapter, optional: true }, { token: MTX_DATETIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
1327
|
+
/** @nocollapse */ MtxMonthView.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MtxMonthView, selector: "mtx-month-view", inputs: { type: "type", dateFilter: "dateFilter", activeDate: "activeDate", selected: "selected" }, outputs: { selectedChange: "selectedChange", _userSelection: "_userSelection" }, exportAs: ["mtxMonthView"], ngImport: i0, template: "<table class=\"mtx-calendar-table\" role=\"grid\">\n <thead class=\"mtx-calendar-table-header\">\n <tr>\n <th *ngFor=\"let day of _weekdays\" [attr.aria-label]=\"day.long\">{{day.narrow}}</th>\n </tr>\n </thead>\n <tbody mtx-calendar-body\n (@slideCalendar.done)=\"_calendarStateDone()\"\n [@slideCalendar]=\"_calendarState\"\n [rows]=\"_weeks\"\n [todayValue]=\"_todayDate!\"\n [activeCell]=\"_adapter.getDate(activeDate) - 1\"\n [selectedValue]=\"_selectedDate!\"\n (selectedValueChange)=\"_dateSelected($event)\"></tbody>\n</table>\n", dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MtxCalendarBody, selector: "[mtx-calendar-body]", inputs: ["label", "rows", "todayValue", "selectedValue", "labelMinRequiredCells", "numCols", "allowDisabledSelection", "activeCell"], outputs: ["selectedValueChange"], exportAs: ["mtxCalendarBody"] }], animations: [mtxDatetimepickerAnimations.slideCalendar], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1328
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxMonthView, decorators: [{
|
|
1329
1329
|
type: Component,
|
|
1330
1330
|
args: [{ selector: 'mtx-month-view', exportAs: 'mtxMonthView', animations: [mtxDatetimepickerAnimations.slideCalendar], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<table class=\"mtx-calendar-table\" role=\"grid\">\n <thead class=\"mtx-calendar-table-header\">\n <tr>\n <th *ngFor=\"let day of _weekdays\" [attr.aria-label]=\"day.long\">{{day.narrow}}</th>\n </tr>\n </thead>\n <tbody mtx-calendar-body\n (@slideCalendar.done)=\"_calendarStateDone()\"\n [@slideCalendar]=\"_calendarState\"\n [rows]=\"_weeks\"\n [todayValue]=\"_todayDate!\"\n [activeCell]=\"_adapter.getDate(activeDate) - 1\"\n [selectedValue]=\"_selectedDate!\"\n (selectedValueChange)=\"_dateSelected($event)\"></tbody>\n</table>\n" }]
|
|
1331
1331
|
}], ctorParameters: function () { return [{ type: i1.DatetimeAdapter, decorators: [{
|
|
@@ -1453,9 +1453,9 @@ class MtxYearView {
|
|
|
1453
1453
|
return false;
|
|
1454
1454
|
}
|
|
1455
1455
|
}
|
|
1456
|
-
/** @nocollapse */ MtxYearView.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
1457
|
-
/** @nocollapse */ MtxYearView.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
1458
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
1456
|
+
/** @nocollapse */ MtxYearView.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxYearView, deps: [{ token: i1.DatetimeAdapter, optional: true }, { token: MTX_DATETIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
1457
|
+
/** @nocollapse */ MtxYearView.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MtxYearView, selector: "mtx-year-view", inputs: { type: "type", dateFilter: "dateFilter", activeDate: "activeDate", selected: "selected" }, outputs: { selectedChange: "selectedChange", _userSelection: "_userSelection" }, exportAs: ["mtxYearView"], ngImport: i0, template: "<table class=\"mtx-calendar-table\" role=\"grid\">\n <thead class=\"mtx-calendar-table-header\"></thead>\n <tbody mtx-calendar-body\n (@slideCalendar.done)=\"_calendarStateDone()\"\n [@slideCalendar]=\"_calendarState\"\n [label]=\"_yearLabel\"\n [rows]=\"_months\"\n [todayValue]=\"_todayMonth!\"\n [labelMinRequiredCells]=\"2\"\n [numCols]=\"4\"\n [activeCell]=\"_adapter.getMonth(activeDate)\"\n [selectedValue]=\"_selectedMonth!\"\n (selectedValueChange)=\"_monthSelected($event)\"\n [allowDisabledSelection]=\"true\"></tbody>\n</table>\n", dependencies: [{ kind: "component", type: MtxCalendarBody, selector: "[mtx-calendar-body]", inputs: ["label", "rows", "todayValue", "selectedValue", "labelMinRequiredCells", "numCols", "allowDisabledSelection", "activeCell"], outputs: ["selectedValueChange"], exportAs: ["mtxCalendarBody"] }], animations: [mtxDatetimepickerAnimations.slideCalendar], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1458
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxYearView, decorators: [{
|
|
1459
1459
|
type: Component,
|
|
1460
1460
|
args: [{ selector: 'mtx-year-view', exportAs: 'mtxYearView', animations: [mtxDatetimepickerAnimations.slideCalendar], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<table class=\"mtx-calendar-table\" role=\"grid\">\n <thead class=\"mtx-calendar-table-header\"></thead>\n <tbody mtx-calendar-body\n (@slideCalendar.done)=\"_calendarStateDone()\"\n [@slideCalendar]=\"_calendarState\"\n [label]=\"_yearLabel\"\n [rows]=\"_months\"\n [todayValue]=\"_todayMonth!\"\n [labelMinRequiredCells]=\"2\"\n [numCols]=\"4\"\n [activeCell]=\"_adapter.getMonth(activeDate)\"\n [selectedValue]=\"_selectedMonth!\"\n (selectedValueChange)=\"_monthSelected($event)\"\n [allowDisabledSelection]=\"true\"></tbody>\n</table>\n" }]
|
|
1461
1461
|
}], ctorParameters: function () { return [{ type: i1.DatetimeAdapter, decorators: [{
|
|
@@ -2082,9 +2082,9 @@ class MtxCalendar {
|
|
|
2082
2082
|
return ('00' + n).slice(-2);
|
|
2083
2083
|
}
|
|
2084
2084
|
}
|
|
2085
|
-
/** @nocollapse */ MtxCalendar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
2086
|
-
/** @nocollapse */ MtxCalendar.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: MtxCalendar, selector: "mtx-calendar", inputs: { multiYearSelector: "multiYearSelector", twelvehour: "twelvehour", startView: "startView", timeInterval: "timeInterval", dateFilter: "dateFilter", preventSameDateTimeSelection: "preventSameDateTimeSelection", type: "type", startAt: "startAt", timeInput: "timeInput", selected: "selected", minDate: "minDate", maxDate: "maxDate" }, outputs: { selectedChange: "selectedChange", viewChanged: "viewChanged", _userSelection: "_userSelection" }, host: { attributes: { "tabindex": "0" }, listeners: { "keydown": "_handleCalendarBodyKeydown($event)" }, properties: { "class.mtx-calendar-with-time-input": "timeInput" }, classAttribute: "mtx-calendar" }, exportAs: ["mtxCalendar"], ngImport: i0, template: "<div class=\"mtx-calendar-header\">\n <button *ngIf=\"type !== 'time'\"\n mat-button type=\"button\" class=\"mtx-calendar-header-year\"\n [class.active]=\"currentView === 'year' || currentView === 'multi-year'\"\n [attr.aria-label]=\"_yearButtonLabel\"\n (click)=\"_yearClicked()\">\n <span>{{ _yearButtonText }}</span>\n <svg *ngIf=\"multiYearSelector || type === 'year'\"\n class=\"mtx-calendar-header-year-dropdown\" matButtonIcon iconPositionEnd\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M7,10L12,15L17,10H7Z\"></path>\n </svg>\n </button>\n <div *ngIf=\"type !== 'year'\" class=\"mtx-calendar-header-date-time\">\n <button *ngIf=\"type !== 'time'\"\n mat-button type=\"button\" class=\"mtx-calendar-header-date\"\n [class.active]=\"currentView === 'month'\"\n [class.not-clickable]=\"type === 'month'\"\n [attr.aria-label]=\"_dateButtonLabel\"\n (click)=\"_dateClicked()\">{{ _dateButtonText }}</button>\n <span *ngIf=\"type.endsWith('time')\" class=\"mtx-calendar-header-time\"\n [class.active]=\"currentView === 'clock'\">\n <span class=\"mtx-calendar-header-hour-minute-container\">\n <button mat-button type=\"button\" class=\"mtx-calendar-header-hours\"\n [class.active]=\"_clockView === 'hour'\"\n [attr.aria-label]=\"_hourButtonLabel\"\n (click)=\"_hoursClicked()\">{{ _hoursButtonText }}</button>\n <span class=\"mtx-calendar-header-hour-minute-separator\">:</span>\n <button mat-button type=\"button\" class=\"mtx-calendar-header-minutes\"\n [class.active]=\"_clockView === 'minute'\"\n [attr.aria-label]=\"_minuteButtonLabel\"\n (click)=\"_minutesClicked()\">{{ _minutesButtonText }}</button>\n </span>\n <span *ngIf=\"twelvehour\" class=\"mtx-calendar-header-ampm-container\">\n <button mat-button type=\"button\" class=\"mtx-calendar-header-ampm\"\n [class.active]=\"_AMPM === 'AM'\" aria-label=\"AM\"\n (click)=\"_ampmClicked('AM')\">AM</button>\n <button mat-button type=\"button\" class=\"mtx-calendar-header-ampm\"\n [class.active]=\"_AMPM === 'PM'\" aria-label=\"PM\"\n (click)=\"_ampmClicked('PM')\">PM</button>\n </span>\n </span>\n </div>\n</div>\n\n<div class=\"mtx-calendar-content\" [ngSwitch]=\"currentView\">\n <div *ngIf=\"currentView === 'month' || currentView === 'year' || currentView === 'multi-year'\"\n class=\"mtx-month-content\">\n <div class=\"mtx-calendar-controls\">\n <button mat-icon-button type=\"button\"\n class=\"mtx-calendar-previous-button\"\n [class.disabled]=\"!_previousEnabled()\"\n [attr.aria-disabled]=\"!_previousEnabled()\"\n [attr.aria-label]=\"_prevButtonLabel\"\n (click)=\"_previousClicked()\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\">\n <path d=\"M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z\"></path>\n </svg>\n </button>\n <div class=\"mtx-calendar-period-button\"\n [@slideCalendar]=\"_calendarState\"\n (@slideCalendar.done)=\"_calendarStateDone()\">\n <strong>{{ _yearPeriodText }}</strong>\n </div>\n <button mat-icon-button type=\"button\"\n class=\"mtx-calendar-next-button\"\n [class.disabled]=\"!_nextEnabled()\"\n [attr.aria-disabled]=\"!_nextEnabled()\"\n [attr.aria-label]=\"_nextButtonLabel\"\n (click)=\"_nextClicked()\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\">\n <path d=\"M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z\"></path>\n </svg>\n </button>\n </div>\n </div>\n <mtx-month-view *ngSwitchCase=\"'month'\"\n (_userSelection)=\"_userSelected()\"\n (selectedChange)=\"_dateSelected($event)\"\n [activeDate]=\"_activeDate\"\n [dateFilter]=\"_dateFilterForViews\"\n [selected]=\"selected!\"\n [type]=\"type\">\n </mtx-month-view>\n <mtx-year-view *ngSwitchCase=\"'year'\"\n (_userSelection)=\"_userSelected()\"\n (selectedChange)=\"_monthSelected($event)\"\n [activeDate]=\"_activeDate\"\n [dateFilter]=\"_dateFilterForViews\"\n [selected]=\"selected!\"\n [type]=\"type\">\n </mtx-year-view>\n <mtx-multi-year-view *ngSwitchCase=\"'multi-year'\"\n (_userSelection)=\"_userSelected()\"\n (selectedChange)=\"_yearSelected($event)\"\n [activeDate]=\"_activeDate\"\n [dateFilter]=\"_dateFilterForViews\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [selected]=\"selected!\"\n [type]=\"type\">\n </mtx-multi-year-view>\n\n <ng-container *ngSwitchDefault>\n <mtx-time *ngIf=\"timeInput; else clock\"\n (_userSelection)=\"_userSelected()\"\n (activeDateChange)=\"_onActiveDateChange($event)\"\n (selectedChange)=\"_timeSelected($event)\"\n [AMPM]=\"_AMPM\"\n (ampmChange)=\"_ampmClicked($event)\"\n [clockView]=\"_clockView\"\n (clockViewChange)=\"_clockView = $event\"\n [twelvehour]=\"twelvehour\"\n [dateFilter]=\"dateFilter\"\n [interval]=\"timeInterval\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [selected]=\"_activeDate\">\n </mtx-time>\n\n <ng-template #clock>\n <mtx-clock (_userSelection)=\"_userSelected()\"\n (activeDateChange)=\"_onActiveDateChange($event)\"\n (selectedChange)=\"_dialTimeSelected($event)\"\n [AMPM]=\"_AMPM\"\n [dateFilter]=\"dateFilter\"\n [interval]=\"timeInterval\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [selected]=\"_activeDate\"\n [startView]=\"_clockView\"\n [twelvehour]=\"twelvehour\">\n </mtx-clock>\n </ng-template>\n </ng-container>\n</div>\n", styles: [".mtx-calendar{display:block;outline:none}.mtx-calendar-header{box-sizing:border-box;padding:8px;border-radius:4px 4px 0 0}.mtx-calendar-header .mtx-calendar-header-year,.mtx-calendar-header .mtx-calendar-header-date,.mtx-calendar-header .mtx-calendar-header-hours,.mtx-calendar-header .mtx-calendar-header-minutes,.mtx-calendar-header .mtx-calendar-header-ampm{height:auto;min-width:auto;padding:0 4px;text-align:inherit;line-height:inherit;color:inherit;font-size:inherit;font-weight:inherit;letter-spacing:normal;white-space:normal;word-break:break-word}.mtx-calendar-header .mtx-calendar-header-year{line-height:24px}.mtx-calendar-header-date-time{font-size:24px;line-height:36px}.mtx-calendar-header-year:not(.active),.mtx-calendar-header-date:not(.active),.mtx-calendar-header-hours:not(.active),.mtx-calendar-header-minutes:not(.active),.mtx-calendar-header-ampm:not(.active){opacity:.6}.mtx-calendar-header-year.not-clickable,.mtx-calendar-header-date.not-clickable,.mtx-calendar-header-hours.not-clickable,.mtx-calendar-header-minutes.not-clickable,.mtx-calendar-header-ampm.not-clickable{cursor:initial}.mtx-calendar-header-time{display:inline-flex}.mtx-calendar-header-time:not(.active){opacity:.6}.mtx-calendar-header-time:not(.active) .mtx-calendar-header-hours,.mtx-calendar-header-time:not(.active) .mtx-calendar-header-minutes,.mtx-calendar-header-time:not(.active) .mtx-calendar-header-ampm{opacity:1}.mtx-calendar-header-hour-minute-separator{display:inline-block;width:8px;text-align:center}.mtx-calendar-header-ampm-container{display:inline-flex;flex-direction:column;line-height:18px;font-size:12px}[mode=landscape] .mtx-calendar{display:flex}[mode=landscape] .mtx-calendar .mtx-calendar-header{width:150px;min-width:150px;padding:16px 8px;border-radius:4px 0 0 4px}[dir=rtl] [mode=landscape] .mtx-calendar .mtx-calendar-header{border-radius:0 4px 4px 0}[mode=landscape] .mtx-calendar .mtx-calendar-header-year+.mtx-calendar-header-date-time,[mode=landscape] .mtx-calendar .mtx-calendar-header-date+.mtx-calendar-header-time{margin-top:4px}[mode=landscape] .mtx-calendar .mtx-calendar-header-date-time{font-size:28px}[mode=landscape] .mtx-calendar .mtx-calendar-header-time{display:flex;flex-direction:column}[mode=landscape] .mtx-calendar .mtx-calendar-header-time .mtx-calendar-header-hours,[mode=landscape] .mtx-calendar .mtx-calendar-header-time .mtx-calendar-header-minutes,[mode=landscape] .mtx-calendar .mtx-calendar-header-time .mtx-calendar-header-ampm{width:40px;text-align:center}[mode=landscape] .mtx-calendar .mtx-calendar-header-ampm-container{flex-direction:row;font-size:20px}[mode=landscape] .mtx-calendar .mtx-calendar-header-ampm{padding:4px}[mode=landscape] .mtx-calendar .mtx-calendar-header-ampm+.mtx-calendar-header-ampm{margin:0 8px}@media all and (orientation: landscape){[mode=auto] .mtx-calendar{display:flex}[mode=auto] .mtx-calendar .mtx-calendar-header{width:150px;min-width:150px;padding:16px 8px;border-radius:4px 0 0 4px}[dir=rtl] [mode=auto] .mtx-calendar .mtx-calendar-header{border-radius:0 4px 4px 0}[mode=auto] .mtx-calendar .mtx-calendar-header-year+.mtx-calendar-header-date-time,[mode=auto] .mtx-calendar .mtx-calendar-header-date+.mtx-calendar-header-time{margin-top:4px}[mode=auto] .mtx-calendar .mtx-calendar-header-date-time{font-size:28px}[mode=auto] .mtx-calendar .mtx-calendar-header-time{display:flex;flex-direction:column}[mode=auto] .mtx-calendar .mtx-calendar-header-time .mtx-calendar-header-hours,[mode=auto] .mtx-calendar .mtx-calendar-header-time .mtx-calendar-header-minutes,[mode=auto] .mtx-calendar .mtx-calendar-header-time .mtx-calendar-header-ampm{width:40px;text-align:center}[mode=auto] .mtx-calendar .mtx-calendar-header-ampm-container{flex-direction:row;font-size:20px}[mode=auto] .mtx-calendar .mtx-calendar-header-ampm{padding:4px}[mode=auto] .mtx-calendar .mtx-calendar-header-ampm+.mtx-calendar-header-ampm{margin:0 8px}}.mtx-calendar-content{width:100%;padding:8px;outline:none;box-sizing:border-box;overflow:hidden}.mtx-calendar-controls{display:flex;justify-content:space-between;margin:0 calc(4.7142857143% - 16px)}.mtx-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:.04}.mtx-calendar-period-button{display:inline-block;height:40px;line-height:40px;outline:none;border:0;background:transparent;box-sizing:border-box}.mtx-calendar-previous-button.disabled,.mtx-calendar-next-button.disabled{pointer-events:none}.mtx-calendar-previous-button svg,.mtx-calendar-next-button svg{fill:currentColor;vertical-align:top}[dir=rtl] .mtx-calendar-previous-button svg,[dir=rtl] .mtx-calendar-next-button svg{transform:rotate(180deg)}.mtx-calendar-table{border-spacing:0;border-collapse:collapse;width:100%}.mtx-calendar-table-header th{text-align:center;padding:8px 0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: MtxClock, selector: "mtx-clock", inputs: ["dateFilter", "interval", "twelvehour", "AMPM", "activeDate", "selected", "minDate", "maxDate", "startView"], outputs: ["selectedChange", "activeDateChange", "_userSelection"], exportAs: ["mtxClock"] }, { kind: "component", type: MtxTime, selector: "mtx-time", inputs: ["dateFilter", "interval", "twelvehour", "AMPM", "activeDate", "selected", "minDate", "maxDate", "clockView"], outputs: ["selectedChange", "activeDateChange", "_userSelection", "ampmChange", "clockViewChange"], exportAs: ["mtxTime"] }, { kind: "component", type: MtxMonthView, selector: "mtx-month-view", inputs: ["type", "dateFilter", "activeDate", "selected"], outputs: ["selectedChange", "_userSelection"], exportAs: ["mtxMonthView"] }, { kind: "component", type: MtxYearView, selector: "mtx-year-view", inputs: ["type", "dateFilter", "activeDate", "selected"], outputs: ["selectedChange", "_userSelection"], exportAs: ["mtxYearView"] }, { kind: "component", type: MtxMultiYearView, selector: "mtx-multi-year-view", inputs: ["type", "dateFilter", "activeDate", "selected", "minDate", "maxDate"], outputs: ["selectedChange", "_userSelection"], exportAs: ["mtxMultiYearView"] }], animations: [mtxDatetimepickerAnimations.slideCalendar], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2087
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
2085
|
+
/** @nocollapse */ MtxCalendar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxCalendar, deps: [{ token: i0.ElementRef }, { token: MtxDatetimepickerIntl }, { token: i0.NgZone }, { token: i1.DatetimeAdapter, optional: true }, { token: MTX_DATETIME_FORMATS, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2086
|
+
/** @nocollapse */ MtxCalendar.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MtxCalendar, selector: "mtx-calendar", inputs: { multiYearSelector: "multiYearSelector", twelvehour: "twelvehour", startView: "startView", timeInterval: "timeInterval", dateFilter: "dateFilter", preventSameDateTimeSelection: "preventSameDateTimeSelection", type: "type", startAt: "startAt", timeInput: "timeInput", selected: "selected", minDate: "minDate", maxDate: "maxDate" }, outputs: { selectedChange: "selectedChange", viewChanged: "viewChanged", _userSelection: "_userSelection" }, host: { attributes: { "tabindex": "0" }, listeners: { "keydown": "_handleCalendarBodyKeydown($event)" }, properties: { "class.mtx-calendar-with-time-input": "timeInput" }, classAttribute: "mtx-calendar" }, exportAs: ["mtxCalendar"], ngImport: i0, template: "<div class=\"mtx-calendar-header\">\n <button *ngIf=\"type !== 'time'\"\n mat-button type=\"button\" class=\"mtx-calendar-header-year\"\n [class.active]=\"currentView === 'year' || currentView === 'multi-year'\"\n [attr.aria-label]=\"_yearButtonLabel\"\n (click)=\"_yearClicked()\">\n <span>{{ _yearButtonText }}</span>\n <svg *ngIf=\"multiYearSelector || type === 'year'\"\n class=\"mtx-calendar-header-year-dropdown\" matButtonIcon iconPositionEnd\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n <path d=\"M7,10L12,15L17,10H7Z\"></path>\n </svg>\n </button>\n <div *ngIf=\"type !== 'year'\" class=\"mtx-calendar-header-date-time\">\n <button *ngIf=\"type !== 'time'\"\n mat-button type=\"button\" class=\"mtx-calendar-header-date\"\n [class.active]=\"currentView === 'month'\"\n [class.not-clickable]=\"type === 'month'\"\n [attr.aria-label]=\"_dateButtonLabel\"\n (click)=\"_dateClicked()\">{{ _dateButtonText }}</button>\n <span *ngIf=\"type.endsWith('time')\" class=\"mtx-calendar-header-time\"\n [class.active]=\"currentView === 'clock'\">\n <span class=\"mtx-calendar-header-hour-minute-container\">\n <button mat-button type=\"button\" class=\"mtx-calendar-header-hours\"\n [class.active]=\"_clockView === 'hour'\"\n [attr.aria-label]=\"_hourButtonLabel\"\n (click)=\"_hoursClicked()\">{{ _hoursButtonText }}</button>\n <span class=\"mtx-calendar-header-hour-minute-separator\">:</span>\n <button mat-button type=\"button\" class=\"mtx-calendar-header-minutes\"\n [class.active]=\"_clockView === 'minute'\"\n [attr.aria-label]=\"_minuteButtonLabel\"\n (click)=\"_minutesClicked()\">{{ _minutesButtonText }}</button>\n </span>\n <span *ngIf=\"twelvehour\" class=\"mtx-calendar-header-ampm-container\">\n <button mat-button type=\"button\" class=\"mtx-calendar-header-ampm\"\n [class.active]=\"_AMPM === 'AM'\" aria-label=\"AM\"\n (click)=\"_ampmClicked('AM')\">AM</button>\n <button mat-button type=\"button\" class=\"mtx-calendar-header-ampm\"\n [class.active]=\"_AMPM === 'PM'\" aria-label=\"PM\"\n (click)=\"_ampmClicked('PM')\">PM</button>\n </span>\n </span>\n </div>\n</div>\n\n<div class=\"mtx-calendar-content\" [ngSwitch]=\"currentView\">\n <div *ngIf=\"currentView === 'month' || currentView === 'year' || currentView === 'multi-year'\"\n class=\"mtx-month-content\">\n <div class=\"mtx-calendar-controls\">\n <button mat-icon-button type=\"button\"\n class=\"mtx-calendar-previous-button\"\n [class.disabled]=\"!_previousEnabled()\"\n [attr.aria-disabled]=\"!_previousEnabled()\"\n [attr.aria-label]=\"_prevButtonLabel\"\n (click)=\"_previousClicked()\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\">\n <path d=\"M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z\"></path>\n </svg>\n </button>\n <div class=\"mtx-calendar-period-button\"\n [@slideCalendar]=\"_calendarState\"\n (@slideCalendar.done)=\"_calendarStateDone()\">\n <strong>{{ _yearPeriodText }}</strong>\n </div>\n <button mat-icon-button type=\"button\"\n class=\"mtx-calendar-next-button\"\n [class.disabled]=\"!_nextEnabled()\"\n [attr.aria-disabled]=\"!_nextEnabled()\"\n [attr.aria-label]=\"_nextButtonLabel\"\n (click)=\"_nextClicked()\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\">\n <path d=\"M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z\"></path>\n </svg>\n </button>\n </div>\n </div>\n <mtx-month-view *ngSwitchCase=\"'month'\"\n (_userSelection)=\"_userSelected()\"\n (selectedChange)=\"_dateSelected($event)\"\n [activeDate]=\"_activeDate\"\n [dateFilter]=\"_dateFilterForViews\"\n [selected]=\"selected!\"\n [type]=\"type\">\n </mtx-month-view>\n <mtx-year-view *ngSwitchCase=\"'year'\"\n (_userSelection)=\"_userSelected()\"\n (selectedChange)=\"_monthSelected($event)\"\n [activeDate]=\"_activeDate\"\n [dateFilter]=\"_dateFilterForViews\"\n [selected]=\"selected!\"\n [type]=\"type\">\n </mtx-year-view>\n <mtx-multi-year-view *ngSwitchCase=\"'multi-year'\"\n (_userSelection)=\"_userSelected()\"\n (selectedChange)=\"_yearSelected($event)\"\n [activeDate]=\"_activeDate\"\n [dateFilter]=\"_dateFilterForViews\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [selected]=\"selected!\"\n [type]=\"type\">\n </mtx-multi-year-view>\n\n <ng-container *ngSwitchDefault>\n <mtx-time *ngIf=\"timeInput; else clock\"\n (_userSelection)=\"_userSelected()\"\n (activeDateChange)=\"_onActiveDateChange($event)\"\n (selectedChange)=\"_timeSelected($event)\"\n [AMPM]=\"_AMPM\"\n (ampmChange)=\"_ampmClicked($event)\"\n [clockView]=\"_clockView\"\n (clockViewChange)=\"_clockView = $event\"\n [twelvehour]=\"twelvehour\"\n [dateFilter]=\"dateFilter\"\n [interval]=\"timeInterval\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [selected]=\"_activeDate\">\n </mtx-time>\n\n <ng-template #clock>\n <mtx-clock (_userSelection)=\"_userSelected()\"\n (activeDateChange)=\"_onActiveDateChange($event)\"\n (selectedChange)=\"_dialTimeSelected($event)\"\n [AMPM]=\"_AMPM\"\n [dateFilter]=\"dateFilter\"\n [interval]=\"timeInterval\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [selected]=\"_activeDate\"\n [startView]=\"_clockView\"\n [twelvehour]=\"twelvehour\">\n </mtx-clock>\n </ng-template>\n </ng-container>\n</div>\n", styles: [".mtx-calendar{display:block;outline:none}.mtx-calendar-header{box-sizing:border-box;padding:8px;border-radius:4px 4px 0 0}.mtx-calendar-header .mtx-calendar-header-year,.mtx-calendar-header .mtx-calendar-header-date,.mtx-calendar-header .mtx-calendar-header-hours,.mtx-calendar-header .mtx-calendar-header-minutes,.mtx-calendar-header .mtx-calendar-header-ampm{height:auto;min-width:auto;padding:0 4px;text-align:inherit;line-height:inherit;color:inherit;font-size:inherit;font-weight:inherit;letter-spacing:normal;white-space:normal;word-break:break-word}.mtx-calendar-header .mtx-calendar-header-year{line-height:24px}.mtx-calendar-header-date-time{font-size:24px;line-height:36px}.mtx-calendar-header-year:not(.active),.mtx-calendar-header-date:not(.active),.mtx-calendar-header-hours:not(.active),.mtx-calendar-header-minutes:not(.active),.mtx-calendar-header-ampm:not(.active){opacity:.6}.mtx-calendar-header-year.not-clickable,.mtx-calendar-header-date.not-clickable,.mtx-calendar-header-hours.not-clickable,.mtx-calendar-header-minutes.not-clickable,.mtx-calendar-header-ampm.not-clickable{cursor:initial}.mtx-calendar-header-time{display:inline-flex}.mtx-calendar-header-time:not(.active){opacity:.6}.mtx-calendar-header-time:not(.active) .mtx-calendar-header-hours,.mtx-calendar-header-time:not(.active) .mtx-calendar-header-minutes,.mtx-calendar-header-time:not(.active) .mtx-calendar-header-ampm{opacity:1}.mtx-calendar-header-hour-minute-separator{display:inline-block;width:8px;text-align:center}.mtx-calendar-header-ampm-container{display:inline-flex;flex-direction:column;line-height:18px;font-size:12px}[mode=landscape] .mtx-calendar{display:flex}[mode=landscape] .mtx-calendar .mtx-calendar-header{width:150px;min-width:150px;padding:16px 8px;border-radius:4px 0 0 4px}[dir=rtl] [mode=landscape] .mtx-calendar .mtx-calendar-header{border-radius:0 4px 4px 0}[mode=landscape] .mtx-calendar .mtx-calendar-header-year+.mtx-calendar-header-date-time,[mode=landscape] .mtx-calendar .mtx-calendar-header-date+.mtx-calendar-header-time{margin-top:4px}[mode=landscape] .mtx-calendar .mtx-calendar-header-date-time{font-size:28px}[mode=landscape] .mtx-calendar .mtx-calendar-header-time{display:flex;flex-direction:column}[mode=landscape] .mtx-calendar .mtx-calendar-header-time .mtx-calendar-header-hours,[mode=landscape] .mtx-calendar .mtx-calendar-header-time .mtx-calendar-header-minutes,[mode=landscape] .mtx-calendar .mtx-calendar-header-time .mtx-calendar-header-ampm{width:40px;text-align:center}[mode=landscape] .mtx-calendar .mtx-calendar-header-ampm-container{flex-direction:row;font-size:20px}[mode=landscape] .mtx-calendar .mtx-calendar-header-ampm{padding:4px}[mode=landscape] .mtx-calendar .mtx-calendar-header-ampm+.mtx-calendar-header-ampm{margin:0 8px}@media all and (orientation: landscape){[mode=auto] .mtx-calendar{display:flex}[mode=auto] .mtx-calendar .mtx-calendar-header{width:150px;min-width:150px;padding:16px 8px;border-radius:4px 0 0 4px}[dir=rtl] [mode=auto] .mtx-calendar .mtx-calendar-header{border-radius:0 4px 4px 0}[mode=auto] .mtx-calendar .mtx-calendar-header-year+.mtx-calendar-header-date-time,[mode=auto] .mtx-calendar .mtx-calendar-header-date+.mtx-calendar-header-time{margin-top:4px}[mode=auto] .mtx-calendar .mtx-calendar-header-date-time{font-size:28px}[mode=auto] .mtx-calendar .mtx-calendar-header-time{display:flex;flex-direction:column}[mode=auto] .mtx-calendar .mtx-calendar-header-time .mtx-calendar-header-hours,[mode=auto] .mtx-calendar .mtx-calendar-header-time .mtx-calendar-header-minutes,[mode=auto] .mtx-calendar .mtx-calendar-header-time .mtx-calendar-header-ampm{width:40px;text-align:center}[mode=auto] .mtx-calendar .mtx-calendar-header-ampm-container{flex-direction:row;font-size:20px}[mode=auto] .mtx-calendar .mtx-calendar-header-ampm{padding:4px}[mode=auto] .mtx-calendar .mtx-calendar-header-ampm+.mtx-calendar-header-ampm{margin:0 8px}}.mtx-calendar-content{width:100%;padding:8px;outline:none;box-sizing:border-box;overflow:hidden}.mtx-calendar-controls{display:flex;justify-content:space-between;margin:0 calc(4.7142857143% - 16px)}.mtx-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:.04}.mtx-calendar-period-button{display:inline-block;height:40px;line-height:40px;outline:none;border:0;background:transparent;box-sizing:border-box}.mtx-calendar-previous-button.disabled,.mtx-calendar-next-button.disabled{pointer-events:none}.mtx-calendar-previous-button svg,.mtx-calendar-next-button svg{fill:currentColor;vertical-align:top}[dir=rtl] .mtx-calendar-previous-button svg,[dir=rtl] .mtx-calendar-next-button svg{transform:rotate(180deg)}.mtx-calendar-table{border-spacing:0;border-collapse:collapse;width:100%}.mtx-calendar-table-header th{text-align:center;padding:8px 0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: MtxClock, selector: "mtx-clock", inputs: ["dateFilter", "interval", "twelvehour", "AMPM", "activeDate", "selected", "minDate", "maxDate", "startView"], outputs: ["selectedChange", "activeDateChange", "_userSelection"], exportAs: ["mtxClock"] }, { kind: "component", type: MtxTime, selector: "mtx-time", inputs: ["dateFilter", "interval", "twelvehour", "AMPM", "activeDate", "selected", "minDate", "maxDate", "clockView"], outputs: ["selectedChange", "activeDateChange", "_userSelection", "ampmChange", "clockViewChange"], exportAs: ["mtxTime"] }, { kind: "component", type: MtxMonthView, selector: "mtx-month-view", inputs: ["type", "dateFilter", "activeDate", "selected"], outputs: ["selectedChange", "_userSelection"], exportAs: ["mtxMonthView"] }, { kind: "component", type: MtxYearView, selector: "mtx-year-view", inputs: ["type", "dateFilter", "activeDate", "selected"], outputs: ["selectedChange", "_userSelection"], exportAs: ["mtxYearView"] }, { kind: "component", type: MtxMultiYearView, selector: "mtx-multi-year-view", inputs: ["type", "dateFilter", "activeDate", "selected", "minDate", "maxDate"], outputs: ["selectedChange", "_userSelection"], exportAs: ["mtxMultiYearView"] }], animations: [mtxDatetimepickerAnimations.slideCalendar], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2087
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxCalendar, decorators: [{
|
|
2088
2088
|
type: Component,
|
|
2089
2089
|
args: [{ selector: 'mtx-calendar', host: {
|
|
2090
2090
|
'class': 'mtx-calendar',
|
|
@@ -2180,12 +2180,12 @@ class MtxDatetimepickerContent extends _MtxDatetimepickerContentBase {
|
|
|
2180
2180
|
this._animationDone.complete();
|
|
2181
2181
|
}
|
|
2182
2182
|
}
|
|
2183
|
-
/** @nocollapse */ MtxDatetimepickerContent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
2184
|
-
/** @nocollapse */ MtxDatetimepickerContent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
2183
|
+
/** @nocollapse */ MtxDatetimepickerContent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerContent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2184
|
+
/** @nocollapse */ MtxDatetimepickerContent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MtxDatetimepickerContent, selector: "mtx-datetimepicker-content", inputs: { color: "color" }, host: { listeners: { "@transformPanel.done": "_animationDone.next()" }, properties: { "class.mtx-datetimepicker-content-touch": "datetimepicker?.touchUi", "attr.mode": "datetimepicker.mode", "@transformPanel": "_animationState" }, classAttribute: "mtx-datetimepicker-content" }, viewQueries: [{ propertyName: "_calendar", first: true, predicate: MtxCalendar, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div cdkTrapFocus\n role=\"dialog\"\n [attr.aria-modal]=\"true\"\n [attr.aria-labelledby]=\"_dialogLabelId ?? undefined\"\n [attr.mode]=\"datetimepicker.mode\"\n class=\"mtx-datetimepicker-content-container\">\n <mtx-calendar [id]=\"datetimepicker.id\"\n [ngClass]=\"datetimepicker.panelClass\"\n [attr.mode]=\"datetimepicker.mode\"\n [type]=\"datetimepicker.type\"\n [startAt]=\"datetimepicker.startAt\"\n [startView]=\"datetimepicker.startView\"\n [maxDate]=\"datetimepicker._maxDate\"\n [minDate]=\"datetimepicker._minDate\"\n [dateFilter]=\"datetimepicker._dateFilter\"\n [multiYearSelector]=\"datetimepicker.multiYearSelector\"\n [preventSameDateTimeSelection]=\"datetimepicker.preventSameDateTimeSelection\"\n [timeInterval]=\"datetimepicker.timeInterval\"\n [twelvehour]=\"datetimepicker.twelvehour\"\n [selected]=\"datetimepicker._selected\"\n [timeInput]=\"datetimepicker.timeInput\"\n (selectedChange)=\"datetimepicker._select($event)\"\n (viewChanged)=\"datetimepicker._viewChanged($event)\"\n (_userSelection)=\"datetimepicker.close()\"\n [@fadeInCalendar]=\"'enter'\">\n </mtx-calendar>\n</div>\n", styles: [".mtx-datetimepicker-content{display:block;border-radius:4px}.mtx-datetimepicker-content-container{display:flex;flex-direction:column;justify-content:space-between}.mtx-datetimepicker-content .mtx-calendar{width:296px;height:424px}.mtx-datetimepicker-content .mtx-calendar.mtx-calendar-with-time-input{height:490px}.mtx-datetimepicker-content[mode=landscape] .mtx-calendar{width:446px;height:328px}.mtx-datetimepicker-content[mode=landscape] .mtx-calendar.mtx-calendar-with-time-input{height:412px}@media all and (orientation: landscape){.mtx-datetimepicker-content[mode=auto] .mtx-calendar{width:446px;height:328px}.mtx-datetimepicker-content[mode=auto] .mtx-calendar.mtx-calendar-with-time-input{height:412px}}.mtx-datetimepicker-content-touch{display:block;max-height:80vh;position:relative;overflow:visible}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container{min-height:300px;max-height:850px;min-width:250px;max-width:750px}.mtx-datetimepicker-content-touch .mtx-calendar{width:100%;height:auto}@media all and (orientation: landscape){.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto],.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape]{width:120vh;height:80vh}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto] .mtx-calendar,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape] .mtx-calendar{width:auto;height:100%}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait]{width:64vh;height:90vh}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait] .mtx-calendar{width:100%;height:auto}}@media all and (orientation: portrait){.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto],.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait]{width:80vw;height:120vw}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=auto] .mtx-calendar,.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=portrait] .mtx-calendar{width:100%;height:auto}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape]{width:90vw;height:64vw}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container[mode=landscape] .mtx-calendar{width:auto;height:100%}.mtx-datetimepicker-content-touch .mtx-datetimepicker-content-container-with-actions{height:135vw}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: MtxCalendar, selector: "mtx-calendar", inputs: ["multiYearSelector", "twelvehour", "startView", "timeInterval", "dateFilter", "preventSameDateTimeSelection", "type", "startAt", "timeInput", "selected", "minDate", "maxDate"], outputs: ["selectedChange", "viewChanged", "_userSelection"], exportAs: ["mtxCalendar"] }], animations: [
|
|
2185
2185
|
mtxDatetimepickerAnimations.transformPanel,
|
|
2186
2186
|
mtxDatetimepickerAnimations.fadeInCalendar,
|
|
2187
2187
|
], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2188
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
2188
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerContent, decorators: [{
|
|
2189
2189
|
type: Component,
|
|
2190
2190
|
args: [{ selector: 'mtx-datetimepicker-content', host: {
|
|
2191
2191
|
'class': 'mtx-datetimepicker-content',
|
|
@@ -2573,9 +2573,9 @@ class MtxDatetimepicker {
|
|
|
2573
2573
|
})));
|
|
2574
2574
|
}
|
|
2575
2575
|
}
|
|
2576
|
-
/** @nocollapse */ MtxDatetimepicker.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
2577
|
-
/** @nocollapse */ MtxDatetimepicker.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
2578
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
2576
|
+
/** @nocollapse */ MtxDatetimepicker.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepicker, deps: [{ token: i4$1.Overlay }, { token: i0.NgZone }, { token: i0.ViewContainerRef }, { token: MTX_DATETIMEPICKER_SCROLL_STRATEGY }, { token: i1.DatetimeAdapter, optional: true }, { token: i6.Directionality, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
2577
|
+
/** @nocollapse */ MtxDatetimepicker.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MtxDatetimepicker, selector: "mtx-datetimepicker", inputs: { multiYearSelector: "multiYearSelector", twelvehour: "twelvehour", startView: "startView", mode: "mode", timeInterval: "timeInterval", preventSameDateTimeSelection: "preventSameDateTimeSelection", panelClass: "panelClass", opened: "opened", color: "color", startAt: "startAt", type: "type", touchUi: "touchUi", timeInput: "timeInput", disabled: "disabled", xPosition: "xPosition", yPosition: "yPosition", restoreFocus: "restoreFocus" }, outputs: { selectedChanged: "selectedChanged", openedStream: "opened", closedStream: "closed", viewChanged: "viewChanged" }, exportAs: ["mtxDatetimepicker"], ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2578
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepicker, decorators: [{
|
|
2579
2579
|
type: Component,
|
|
2580
2580
|
args: [{
|
|
2581
2581
|
selector: 'mtx-datetimepicker',
|
|
@@ -2920,13 +2920,13 @@ class MtxDatetimepickerInput {
|
|
|
2920
2920
|
return this._formField ? this._formField.color : undefined;
|
|
2921
2921
|
}
|
|
2922
2922
|
}
|
|
2923
|
-
/** @nocollapse */ MtxDatetimepickerInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
2924
|
-
/** @nocollapse */ MtxDatetimepickerInput.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.
|
|
2923
|
+
/** @nocollapse */ MtxDatetimepickerInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerInput, deps: [{ token: i0.ElementRef }, { token: i1.DatetimeAdapter, optional: true }, { token: MTX_DATETIME_FORMATS, optional: true }, { token: i2$2.MatFormField, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
|
|
2924
|
+
/** @nocollapse */ MtxDatetimepickerInput.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: MtxDatetimepickerInput, selector: "input[mtxDatetimepicker]", inputs: { mtxDatetimepicker: "mtxDatetimepicker", mtxDatetimepickerFilter: "mtxDatetimepickerFilter", value: "value", min: "min", max: "max", disabled: "disabled" }, outputs: { dateChange: "dateChange", dateInput: "dateInput" }, host: { listeners: { "input": "_onInput($event.target.value)", "change": "_onChange()", "blur": "_onBlur()", "keydown": "_onKeydown($event)" }, properties: { "attr.aria-haspopup": "true", "attr.aria-owns": "(_datetimepicker?.opened && _datetimepicker.id) || null", "attr.min": "min ? _dateAdapter.toIso8601(min) : null", "attr.max": "max ? _dateAdapter.toIso8601(max) : null", "disabled": "disabled" } }, providers: [
|
|
2925
2925
|
MAT_DATETIMEPICKER_VALUE_ACCESSOR,
|
|
2926
2926
|
MAT_DATETIMEPICKER_VALIDATORS,
|
|
2927
2927
|
{ provide: MAT_INPUT_VALUE_ACCESSOR, useExisting: MtxDatetimepickerInput },
|
|
2928
2928
|
], exportAs: ["mtxDatetimepickerInput"], ngImport: i0 });
|
|
2929
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
2929
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerInput, decorators: [{
|
|
2930
2930
|
type: Directive,
|
|
2931
2931
|
args: [{
|
|
2932
2932
|
selector: 'input[mtxDatetimepicker]',
|
|
@@ -2978,9 +2978,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
|
|
|
2978
2978
|
/** Can be used to override the icon of a `mtxDatetimepickerToggle`. */
|
|
2979
2979
|
class MtxDatetimepickerToggleIcon {
|
|
2980
2980
|
}
|
|
2981
|
-
/** @nocollapse */ MtxDatetimepickerToggleIcon.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
2982
|
-
/** @nocollapse */ MtxDatetimepickerToggleIcon.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.
|
|
2983
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
2981
|
+
/** @nocollapse */ MtxDatetimepickerToggleIcon.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerToggleIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
2982
|
+
/** @nocollapse */ MtxDatetimepickerToggleIcon.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.1", type: MtxDatetimepickerToggleIcon, selector: "[mtxDatetimepickerToggleIcon]", ngImport: i0 });
|
|
2983
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerToggleIcon, decorators: [{
|
|
2984
2984
|
type: Directive,
|
|
2985
2985
|
args: [{
|
|
2986
2986
|
selector: '[mtxDatetimepickerToggleIcon]',
|
|
@@ -3032,9 +3032,9 @@ class MtxDatetimepickerToggle {
|
|
|
3032
3032
|
this._stateChanges = merge(this._intl.changes, datetimepickerDisabled, inputDisabled, datetimepickerToggled).subscribe(() => this._changeDetectorRef.markForCheck());
|
|
3033
3033
|
}
|
|
3034
3034
|
}
|
|
3035
|
-
/** @nocollapse */ MtxDatetimepickerToggle.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
3036
|
-
/** @nocollapse */ MtxDatetimepickerToggle.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
3037
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
3035
|
+
/** @nocollapse */ MtxDatetimepickerToggle.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerToggle, deps: [{ token: MtxDatetimepickerIntl }, { token: i0.ChangeDetectorRef }, { token: 'tabindex', attribute: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
3036
|
+
/** @nocollapse */ MtxDatetimepickerToggle.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MtxDatetimepickerToggle, selector: "mtx-datetimepicker-toggle", inputs: { datetimepicker: ["for", "datetimepicker"], tabIndex: "tabIndex", ariaLabel: ["aria-label", "ariaLabel"], disabled: "disabled", disableRipple: "disableRipple" }, host: { listeners: { "click": "_open($event)" }, properties: { "attr.tabindex": "null", "class.mtx-datetimepicker-toggle-active": "datetimepicker && datetimepicker.opened", "class.mat-accent": "datetimepicker && datetimepicker.color === \"accent\"", "class.mat-warn": "datetimepicker && datetimepicker.color === \"warn\"", "attr.data-mtx-calendar": "datetimepicker ? datetimepicker.id : null" }, classAttribute: "mtx-datetimepicker-toggle" }, queries: [{ propertyName: "_customIcon", first: true, predicate: MtxDatetimepickerToggleIcon, descendants: true }], viewQueries: [{ propertyName: "_button", first: true, predicate: ["button"], descendants: true }], exportAs: ["mtxDatetimepickerToggle"], usesOnChanges: true, ngImport: i0, template: "<button #button\n mat-icon-button\n type=\"button\"\n [attr.aria-haspopup]=\"datetimepicker ? 'dialog' : null\"\n [attr.aria-label]=\"ariaLabel || _intl.openCalendarLabel\"\n [attr.tabindex]=\"disabled ? -1 : tabIndex\"\n [disabled]=\"disabled\"\n [disableRipple]=\"disableRipple\">\n\n <ng-container *ngIf=\"!_customIcon\" [ngSwitch]=\"datetimepicker.type\">\n <svg *ngSwitchCase=\"'time'\"\n class=\"mtx-datetimepicker-toggle-default-icon\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n height=\"24px\"\n fill=\"currentColor\"\n focusable=\"false\">\n <path\n d=\"M12,20A8,8 0 0,0 20,12A8,8 0 0,0 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22C6.47,22 2,17.5 2,12A10,10 0 0,1 12,2M12.5,7V12.25L17,14.92L16.25,16.15L11,13V7H12.5Z\">\n </path>\n </svg>\n <svg *ngSwitchCase=\"'datetime'\"\n class=\"mtx-datetimepicker-toggle-default-icon\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n height=\"24px\"\n fill=\"currentColor\"\n focusable=\"false\">\n <path\n d=\"M15,13H16.5V15.82L18.94,17.23L18.19,18.53L15,16.69V13M19,8H5V19H9.67C9.24,18.09 9,17.07 9,16A7,7 0 0,1 16,9C17.07,9 18.09,9.24 19,9.67V8M5,21C3.89,21 3,20.1 3,19V5C3,3.89 3.89,3 5,3H6V1H8V3H16V1H18V3H19A2,2 0 0,1 21,5V11.1C22.24,12.36 23,14.09 23,16A7,7 0 0,1 16,23C14.09,23 12.36,22.24 11.1,21H5M16,11.15A4.85,4.85 0 0,0 11.15,16C11.15,18.68 13.32,20.85 16,20.85A4.85,4.85 0 0,0 20.85,16C20.85,13.32 18.68,11.15 16,11.15Z\">\n </path>\n </svg>\n <svg *ngSwitchDefault\n class=\"mtx-datetimepicker-toggle-default-icon\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n height=\"24px\"\n fill=\"currentColor\"\n focusable=\"false\">\n <path d=\"M0 0h24v24H0z\" fill=\"none\" />\n <path\n d=\"M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM7 10h5v5H7z\" />\n </svg>\n </ng-container>\n\n <ng-content select=\"[mtxDatetimepickerToggleIcon]\"></ng-content>\n</button>\n", styles: [".mat-form-field-appearance-legacy .mat-form-field-prefix .mtx-datetimepicker-toggle-default-icon,.mat-form-field-appearance-legacy .mat-form-field-suffix .mtx-datetimepicker-toggle-default-icon{width:1em}.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-prefix .mtx-datetimepicker-toggle-default-icon,.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-suffix .mtx-datetimepicker-toggle-default-icon{display:block;width:1.5em;height:1.5em}.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-prefix .mat-icon-button .mtx-datetimepicker-toggle-default-icon,.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-suffix .mat-icon-button .mtx-datetimepicker-toggle-default-icon{margin:auto}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
3037
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerToggle, decorators: [{
|
|
3038
3038
|
type: Component,
|
|
3039
3039
|
args: [{ selector: 'mtx-datetimepicker-toggle', host: {
|
|
3040
3040
|
'class': 'mtx-datetimepicker-toggle',
|
|
@@ -3074,8 +3074,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
|
|
|
3074
3074
|
|
|
3075
3075
|
class MtxDatetimepickerModule {
|
|
3076
3076
|
}
|
|
3077
|
-
/** @nocollapse */ MtxDatetimepickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
3078
|
-
/** @nocollapse */ MtxDatetimepickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.
|
|
3077
|
+
/** @nocollapse */ MtxDatetimepickerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
3078
|
+
/** @nocollapse */ MtxDatetimepickerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerModule, declarations: [MtxCalendar,
|
|
3079
3079
|
MtxCalendarBody,
|
|
3080
3080
|
MtxClock,
|
|
3081
3081
|
MtxTime,
|
|
@@ -3099,8 +3099,8 @@ class MtxDatetimepickerModule {
|
|
|
3099
3099
|
MtxMonthView,
|
|
3100
3100
|
MtxYearView,
|
|
3101
3101
|
MtxMultiYearView] });
|
|
3102
|
-
/** @nocollapse */ MtxDatetimepickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.
|
|
3103
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
3102
|
+
/** @nocollapse */ MtxDatetimepickerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerModule, providers: [MTX_DATETIMEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER], imports: [CommonModule, MatButtonModule, OverlayModule, A11yModule, PortalModule] });
|
|
3103
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDatetimepickerModule, decorators: [{
|
|
3104
3104
|
type: NgModule,
|
|
3105
3105
|
args: [{
|
|
3106
3106
|
imports: [CommonModule, MatButtonModule, OverlayModule, A11yModule, PortalModule],
|
package/fesm2020/mtxDialog.mjs
CHANGED
|
@@ -26,9 +26,9 @@ class MtxDialogContainer {
|
|
|
26
26
|
this.dialogRef.close();
|
|
27
27
|
}
|
|
28
28
|
}
|
|
29
|
-
/** @nocollapse */ MtxDialogContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
30
|
-
/** @nocollapse */ MtxDialogContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
31
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
29
|
+
/** @nocollapse */ MtxDialogContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDialogContainer, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
30
|
+
/** @nocollapse */ MtxDialogContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MtxDialogContainer, selector: "mtx-dialog-container", host: { classAttribute: "mtx-dialog-container" }, exportAs: ["mtxDialogContainer"], ngImport: i0, template: "<h1 class=\"mtx-dialog-title\" *ngIf=\"data.title\">\n <span>{{data.title | toObservable | async}}</span>\n <button mat-icon-button *ngIf=\"data.showCloseIcon\" (click)=\"_onClose()\">\n <mat-icon>close</mat-icon>\n </button>\n</h1>\n<div class=\"mtx-dialog-content\" *ngIf=\"data.description\">\n <p>{{data.description | toObservable | async}}</p>\n</div>\n<div class=\"mtx-dialog-actions\">\n <ng-container *ngFor=\"let btn of data.buttons\">\n <ng-container [ngSwitch]=\"btn.type\">\n <ng-container *ngSwitchCase=\"'raised'\">\n <button mat-raised-button *ngIf=\"btn.focusInitial\" cdkFocusInitial\n [color]=\"btn.color\" [ngClass]=\"btn.class!\" (click)=\"_onClick(btn.onClick!)\">\n {{btn.text | toObservable | async}}\n </button>\n <button mat-raised-button *ngIf=\"!btn.focusInitial\"\n [color]=\"btn.color\" [ngClass]=\"btn.class!\" (click)=\"_onClick(btn.onClick!)\">\n {{btn.text | toObservable | async}}\n </button>\n </ng-container>\n <ng-container *ngSwitchCase=\"'stroked'\">\n <button mat-stroked-button *ngIf=\"btn.focusInitial\" cdkFocusInitial\n [color]=\"btn.color\" [ngClass]=\"btn.class!\" (click)=\"_onClick(btn.onClick!)\">\n {{btn.text | toObservable | async}}\n </button>\n <button mat-stroked-button *ngIf=\"!btn.focusInitial\"\n [color]=\"btn.color\" [ngClass]=\"btn.class!\" (click)=\"_onClick(btn.onClick!)\">\n {{btn.text | toObservable | async}}\n </button>\n </ng-container>\n <ng-container *ngSwitchCase=\"'flat'\">\n <button mat-flat-button *ngIf=\"btn.focusInitial\" cdkFocusInitial\n [color]=\"btn.color\" [ngClass]=\"btn.class!\" (click)=\"_onClick(btn.onClick!)\">\n {{btn.text | toObservable | async}}\n </button>\n <button mat-flat-button *ngIf=\"!btn.focusInitial\"\n [color]=\"btn.color\" [ngClass]=\"btn.class!\" (click)=\"_onClick(btn.onClick!)\">\n {{btn.text | toObservable | async}}\n </button>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <button mat-button *ngIf=\"btn.focusInitial\" cdkFocusInitial\n [color]=\"btn.color\" [ngClass]=\"btn.class!\" (click)=\"_onClick(btn.onClick!)\">\n {{btn.text | toObservable | async}}\n </button>\n <button mat-button *ngIf=\"!btn.focusInitial\"\n [color]=\"btn.color\" [ngClass]=\"btn.class!\" (click)=\"_onClick(btn.onClick!)\">\n {{btn.text | toObservable | async}}\n </button>\n </ng-container>\n </ng-container>\n </ng-container>\n</div>\n", styles: [".mtx-dialog-title{display:flex;justify-content:space-between;align-items:center;padding:8px 24px;margin:0;line-height:48px;font-weight:500;font-size:20px}.mtx-dialog-title .mat-mdc-button-base{margin-right:-16px}[dir=rtl] .mtx-dialog-title .mat-mdc-button-base{margin-right:0;margin-left:-16px}.mtx-dialog-content{display:block;max-height:65vh;padding:0 24px;overflow:auto;-webkit-overflow-scrolling:touch}.mtx-dialog-content p{margin-top:0}.mtx-dialog-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;padding:8px}.mtx-dialog-actions .mat-mdc-button-base{margin-left:8px}[dir=rtl] .mtx-dialog-actions .mat-mdc-button-base{margin-left:0;margin-right:8px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i3.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.MtxToObservablePipe, name: "toObservable" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
31
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDialogContainer, decorators: [{
|
|
32
32
|
type: Component,
|
|
33
33
|
args: [{ selector: 'mtx-dialog-container', exportAs: 'mtxDialogContainer', host: {
|
|
34
34
|
class: 'mtx-dialog-container',
|
|
@@ -102,18 +102,18 @@ class MtxDialog {
|
|
|
102
102
|
});
|
|
103
103
|
}
|
|
104
104
|
}
|
|
105
|
-
/** @nocollapse */ MtxDialog.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
106
|
-
/** @nocollapse */ MtxDialog.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.
|
|
107
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
105
|
+
/** @nocollapse */ MtxDialog.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDialog, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
106
|
+
/** @nocollapse */ MtxDialog.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDialog });
|
|
107
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDialog, decorators: [{
|
|
108
108
|
type: Injectable
|
|
109
109
|
}], ctorParameters: function () { return [{ type: i1.MatDialog }]; } });
|
|
110
110
|
|
|
111
111
|
class MtxDialogModule {
|
|
112
112
|
}
|
|
113
|
-
/** @nocollapse */ MtxDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
114
|
-
/** @nocollapse */ MtxDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.
|
|
115
|
-
/** @nocollapse */ MtxDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.
|
|
116
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
113
|
+
/** @nocollapse */ MtxDialogModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
114
|
+
/** @nocollapse */ MtxDialogModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: MtxDialogModule, declarations: [MtxDialogContainer], imports: [CommonModule, MatDialogModule, MatButtonModule, MatIconModule, MtxPipesModule], exports: [MtxDialogContainer] });
|
|
115
|
+
/** @nocollapse */ MtxDialogModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDialogModule, providers: [MtxDialog], imports: [CommonModule, MatDialogModule, MatButtonModule, MatIconModule, MtxPipesModule] });
|
|
116
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDialogModule, decorators: [{
|
|
117
117
|
type: NgModule,
|
|
118
118
|
args: [{
|
|
119
119
|
imports: [CommonModule, MatDialogModule, MatButtonModule, MatIconModule, MtxPipesModule],
|
package/fesm2020/mtxDrawer.mjs
CHANGED
|
@@ -284,9 +284,9 @@ class MtxDrawerContainer extends BasePortalOutlet {
|
|
|
284
284
|
}
|
|
285
285
|
}
|
|
286
286
|
}
|
|
287
|
-
/** @nocollapse */ MtxDrawerContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
288
|
-
/** @nocollapse */ MtxDrawerContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.
|
|
289
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
287
|
+
/** @nocollapse */ MtxDrawerContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDrawerContainer, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.FocusTrapFactory }, { token: i1.InteractivityChecker }, { token: i0.NgZone }, { token: i2.BreakpointObserver }, { token: DOCUMENT, optional: true }, { token: MtxDrawerConfig }], target: i0.ɵɵFactoryTarget.Component });
|
|
288
|
+
/** @nocollapse */ MtxDrawerContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: MtxDrawerContainer, selector: "mtx-drawer-container", host: { attributes: { "tabindex": "-1", "role": "dialog", "aria-modal": "true" }, listeners: { "@state.start": "_onAnimationStart($event)", "@state.done": "_onAnimationDone($event)" }, properties: { "class": "_drawerPosition", "attr.aria-label": "drawerConfig?.ariaLabel", "@state": "_animationState" }, classAttribute: "mtx-drawer-container" }, viewQueries: [{ propertyName: "_portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"mtx-drawer-content-wrapper\" [style]=\"_getDrawerSize()\">\n <ng-template cdkPortalOutlet></ng-template>\n</div>\n", styles: [".mtx-drawer-container{display:block;outline:0}.cdk-high-contrast-active .mtx-drawer-container{outline:1px solid}.mtx-drawer-content-wrapper{box-sizing:border-box;padding:8px 16px;overflow:auto}.mtx-drawer-right{transform:translate(100%)}.mtx-drawer-left{transform:translate(-100%)}.mtx-drawer-bottom{transform:translateY(100%)}.mtx-drawer-top{transform:translateY(-100%)}\n"], dependencies: [{ kind: "directive", type: i4.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], animations: [mtxDrawerAnimations.drawerState], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
289
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDrawerContainer, decorators: [{
|
|
290
290
|
type: Component,
|
|
291
291
|
args: [{ selector: 'mtx-drawer-container', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, animations: [mtxDrawerAnimations.drawerState], host: {
|
|
292
292
|
'class': 'mtx-drawer-container',
|
|
@@ -527,9 +527,9 @@ class MtxDrawer {
|
|
|
527
527
|
return Injector.create({ parent: userInjector || this._injector, providers });
|
|
528
528
|
}
|
|
529
529
|
}
|
|
530
|
-
/** @nocollapse */ MtxDrawer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
531
|
-
/** @nocollapse */ MtxDrawer.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.
|
|
532
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
530
|
+
/** @nocollapse */ MtxDrawer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDrawer, deps: [{ token: i1$1.Overlay }, { token: i0.Injector }, { token: MtxDrawer, optional: true, skipSelf: true }, { token: MTX_DRAWER_DEFAULT_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
531
|
+
/** @nocollapse */ MtxDrawer.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDrawer });
|
|
532
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDrawer, decorators: [{
|
|
533
533
|
type: Injectable
|
|
534
534
|
}], ctorParameters: function () { return [{ type: i1$1.Overlay }, { type: i0.Injector }, { type: MtxDrawer, decorators: [{
|
|
535
535
|
type: Optional
|
|
@@ -553,10 +553,10 @@ function _applyConfigDefaults(defaults, config) {
|
|
|
553
553
|
|
|
554
554
|
class MtxDrawerModule {
|
|
555
555
|
}
|
|
556
|
-
/** @nocollapse */ MtxDrawerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.
|
|
557
|
-
/** @nocollapse */ MtxDrawerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.
|
|
558
|
-
/** @nocollapse */ MtxDrawerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.
|
|
559
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.
|
|
556
|
+
/** @nocollapse */ MtxDrawerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDrawerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
557
|
+
/** @nocollapse */ MtxDrawerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.1", ngImport: i0, type: MtxDrawerModule, declarations: [MtxDrawerContainer], imports: [OverlayModule, PortalModule, MatCommonModule], exports: [MtxDrawerContainer, MatCommonModule] });
|
|
558
|
+
/** @nocollapse */ MtxDrawerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDrawerModule, providers: [MtxDrawer], imports: [OverlayModule, PortalModule, MatCommonModule, MatCommonModule] });
|
|
559
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: MtxDrawerModule, decorators: [{
|
|
560
560
|
type: NgModule,
|
|
561
561
|
args: [{
|
|
562
562
|
imports: [OverlayModule, PortalModule, MatCommonModule],
|