source: trip-planner-front/node_modules/@angular/material/bundles/material-datepicker.umd.js@ 84d0fbb

Last change on this file since 84d0fbb was e29cc2e, checked in by Ema <ema_spirova@…>, 3 years ago

primeNG components

  • Property mode set to 100644
File size: 235.8 KB
Line 
1(function (global, factory) {
2 typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/cdk/a11y'), require('@angular/cdk/overlay'), require('@angular/cdk/portal'), require('@angular/common'), require('@angular/core'), require('@angular/material/button'), require('@angular/cdk/scrolling'), require('@angular/material/core'), require('rxjs'), require('@angular/cdk/keycodes'), require('@angular/cdk/bidi'), require('rxjs/operators'), require('@angular/cdk/coercion'), require('@angular/cdk/platform'), require('@angular/animations'), require('@angular/forms'), require('@angular/material/form-field'), require('@angular/material/input')) :
3 typeof define === 'function' && define.amd ? define('@angular/material/datepicker', ['exports', '@angular/cdk/a11y', '@angular/cdk/overlay', '@angular/cdk/portal', '@angular/common', '@angular/core', '@angular/material/button', '@angular/cdk/scrolling', '@angular/material/core', 'rxjs', '@angular/cdk/keycodes', '@angular/cdk/bidi', 'rxjs/operators', '@angular/cdk/coercion', '@angular/cdk/platform', '@angular/animations', '@angular/forms', '@angular/material/form-field', '@angular/material/input'], factory) :
4 (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.ng = global.ng || {}, global.ng.material = global.ng.material || {}, global.ng.material.datepicker = {}), global.ng.cdk.a11y, global.ng.cdk.overlay, global.ng.cdk.portal, global.ng.common, global.ng.core, global.ng.material.button, global.ng.cdk.scrolling, global.ng.material.core, global.rxjs, global.ng.cdk.keycodes, global.ng.cdk.bidi, global.rxjs.operators, global.ng.cdk.coercion, global.ng.cdk.platform, global.ng.animations, global.ng.forms, global.ng.material.formField, global.ng.material.input));
5}(this, (function (exports, a11y, overlay, portal, common, i0, button, scrolling, core, rxjs, keycodes, bidi, operators, coercion, platform, animations, forms, formField, input) { 'use strict';
6
7 function _interopNamespace(e) {
8 if (e && e.__esModule) return e;
9 var n = Object.create(null);
10 if (e) {
11 Object.keys(e).forEach(function (k) {
12 if (k !== 'default') {
13 var d = Object.getOwnPropertyDescriptor(e, k);
14 Object.defineProperty(n, k, d.get ? d : {
15 enumerable: true,
16 get: function () {
17 return e[k];
18 }
19 });
20 }
21 });
22 }
23 n['default'] = e;
24 return Object.freeze(n);
25 }
26
27 var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
28
29 /**
30 * @license
31 * Copyright Google LLC All Rights Reserved.
32 *
33 * Use of this source code is governed by an MIT-style license that can be
34 * found in the LICENSE file at https://angular.io/license
35 */
36 /** @docs-private */
37 function createMissingDateImplError(provider) {
38 return Error("MatDatepicker: No provider found for " + provider + ". You must import one of the following " +
39 "modules at your application root: MatNativeDateModule, MatMomentDateModule, or provide a " +
40 "custom implementation.");
41 }
42
43 /**
44 * @license
45 * Copyright Google LLC All Rights Reserved.
46 *
47 * Use of this source code is governed by an MIT-style license that can be
48 * found in the LICENSE file at https://angular.io/license
49 */
50 /** Datepicker data that requires internationalization. */
51 var MatDatepickerIntl = /** @class */ (function () {
52 function MatDatepickerIntl() {
53 /**
54 * Stream that emits whenever the labels here are changed. Use this to notify
55 * components if the labels have changed after initialization.
56 */
57 this.changes = new rxjs.Subject();
58 /** A label for the calendar popup (used by screen readers). */
59 this.calendarLabel = 'Calendar';
60 /** A label for the button used to open the calendar popup (used by screen readers). */
61 this.openCalendarLabel = 'Open calendar';
62 /** Label for the button used to close the calendar popup. */
63 this.closeCalendarLabel = 'Close calendar';
64 /** A label for the previous month button (used by screen readers). */
65 this.prevMonthLabel = 'Previous month';
66 /** A label for the next month button (used by screen readers). */
67 this.nextMonthLabel = 'Next month';
68 /** A label for the previous year button (used by screen readers). */
69 this.prevYearLabel = 'Previous year';
70 /** A label for the next year button (used by screen readers). */
71 this.nextYearLabel = 'Next year';
72 /** A label for the previous multi-year button (used by screen readers). */
73 this.prevMultiYearLabel = 'Previous 24 years';
74 /** A label for the next multi-year button (used by screen readers). */
75 this.nextMultiYearLabel = 'Next 24 years';
76 /** A label for the 'switch to month view' button (used by screen readers). */
77 this.switchToMonthViewLabel = 'Choose date';
78 /** A label for the 'switch to year view' button (used by screen readers). */
79 this.switchToMultiYearViewLabel = 'Choose month and year';
80 }
81 /** Formats a range of years. */
82 MatDatepickerIntl.prototype.formatYearRange = function (start, end) {
83 return start + " \u2013 " + end;
84 };
85 return MatDatepickerIntl;
86 }());
87 MatDatepickerIntl.ɵprov = i0__namespace.ɵɵdefineInjectable({ factory: function MatDatepickerIntl_Factory() { return new MatDatepickerIntl(); }, token: MatDatepickerIntl, providedIn: "root" });
88 MatDatepickerIntl.decorators = [
89 { type: i0.Injectable, args: [{ providedIn: 'root' },] }
90 ];
91
92 /**
93 * @license
94 * Copyright Google LLC All Rights Reserved.
95 *
96 * Use of this source code is governed by an MIT-style license that can be
97 * found in the LICENSE file at https://angular.io/license
98 */
99 /**
100 * An internal class that represents the data corresponding to a single calendar cell.
101 * @docs-private
102 */
103 var MatCalendarCell = /** @class */ (function () {
104 function MatCalendarCell(value, displayValue, ariaLabel, enabled, cssClasses, compareValue, rawValue) {
105 if (cssClasses === void 0) { cssClasses = {}; }
106 if (compareValue === void 0) { compareValue = value; }
107 this.value = value;
108 this.displayValue = displayValue;
109 this.ariaLabel = ariaLabel;
110 this.enabled = enabled;
111 this.cssClasses = cssClasses;
112 this.compareValue = compareValue;
113 this.rawValue = rawValue;
114 }
115 return MatCalendarCell;
116 }());
117 /**
118 * An internal component used to display calendar data in a table.
119 * @docs-private
120 */
121 var MatCalendarBody = /** @class */ (function () {
122 function MatCalendarBody(_elementRef, _ngZone) {
123 var _this = this;
124 this._elementRef = _elementRef;
125 this._ngZone = _ngZone;
126 /** The number of columns in the table. */
127 this.numCols = 7;
128 /** The cell number of the active cell in the table. */
129 this.activeCell = 0;
130 /** Whether a range is being selected. */
131 this.isRange = false;
132 /**
133 * The aspect ratio (width / height) to use for the cells in the table. This aspect ratio will be
134 * maintained even as the table resizes.
135 */
136 this.cellAspectRatio = 1;
137 /** Start of the preview range. */
138 this.previewStart = null;
139 /** End of the preview range. */
140 this.previewEnd = null;
141 /** Emits when a new value is selected. */
142 this.selectedValueChange = new i0.EventEmitter();
143 /** Emits when the preview has changed as a result of a user action. */
144 this.previewChange = new i0.EventEmitter();
145 /**
146 * Event handler for when the user enters an element
147 * inside the calendar body (e.g. by hovering in or focus).
148 */
149 this._enterHandler = function (event) {
150 if (_this._skipNextFocus && event.type === 'focus') {
151 _this._skipNextFocus = false;
152 return;
153 }
154 // We only need to hit the zone when we're selecting a range.
155 if (event.target && _this.isRange) {
156 var cell_1 = _this._getCellFromElement(event.target);
157 if (cell_1) {
158 _this._ngZone.run(function () { return _this.previewChange.emit({ value: cell_1.enabled ? cell_1 : null, event: event }); });
159 }
160 }
161 };
162 /**
163 * Event handler for when the user's pointer leaves an element
164 * inside the calendar body (e.g. by hovering out or blurring).
165 */
166 this._leaveHandler = function (event) {
167 // We only need to hit the zone when we're selecting a range.
168 if (_this.previewEnd !== null && _this.isRange) {
169 // Only reset the preview end value when leaving cells. This looks better, because
170 // we have a gap between the cells and the rows and we don't want to remove the
171 // range just for it to show up again when the user moves a few pixels to the side.
172 if (event.target && isTableCell(event.target)) {
173 _this._ngZone.run(function () { return _this.previewChange.emit({ value: null, event: event }); });
174 }
175 }
176 };
177 _ngZone.runOutsideAngular(function () {
178 var element = _elementRef.nativeElement;
179 element.addEventListener('mouseenter', _this._enterHandler, true);
180 element.addEventListener('focus', _this._enterHandler, true);
181 element.addEventListener('mouseleave', _this._leaveHandler, true);
182 element.addEventListener('blur', _this._leaveHandler, true);
183 });
184 }
185 /** Called when a cell is clicked. */
186 MatCalendarBody.prototype._cellClicked = function (cell, event) {
187 if (cell.enabled) {
188 this.selectedValueChange.emit({ value: cell.value, event: event });
189 }
190 };
191 /** Returns whether a cell should be marked as selected. */
192 MatCalendarBody.prototype._isSelected = function (value) {
193 return this.startValue === value || this.endValue === value;
194 };
195 MatCalendarBody.prototype.ngOnChanges = function (changes) {
196 var columnChanges = changes['numCols'];
197 var _a = this, rows = _a.rows, numCols = _a.numCols;
198 if (changes['rows'] || columnChanges) {
199 this._firstRowOffset = rows && rows.length && rows[0].length ? numCols - rows[0].length : 0;
200 }
201 if (changes['cellAspectRatio'] || columnChanges || !this._cellPadding) {
202 this._cellPadding = 50 * this.cellAspectRatio / numCols + "%";
203 }
204 if (columnChanges || !this._cellWidth) {
205 this._cellWidth = 100 / numCols + "%";
206 }
207 };
208 MatCalendarBody.prototype.ngOnDestroy = function () {
209 var element = this._elementRef.nativeElement;
210 element.removeEventListener('mouseenter', this._enterHandler, true);
211 element.removeEventListener('focus', this._enterHandler, true);
212 element.removeEventListener('mouseleave', this._leaveHandler, true);
213 element.removeEventListener('blur', this._leaveHandler, true);
214 };
215 /** Returns whether a cell is active. */
216 MatCalendarBody.prototype._isActiveCell = function (rowIndex, colIndex) {
217 var cellNumber = rowIndex * this.numCols + colIndex;
218 // Account for the fact that the first row may not have as many cells.
219 if (rowIndex) {
220 cellNumber -= this._firstRowOffset;
221 }
222 return cellNumber == this.activeCell;
223 };
224 /** Focuses the active cell after the microtask queue is empty. */
225 MatCalendarBody.prototype._focusActiveCell = function (movePreview) {
226 var _this = this;
227 if (movePreview === void 0) { movePreview = true; }
228 this._ngZone.runOutsideAngular(function () {
229 _this._ngZone.onStable.pipe(operators.take(1)).subscribe(function () {
230 var activeCell = _this._elementRef.nativeElement.querySelector('.mat-calendar-body-active');
231 if (activeCell) {
232 if (!movePreview) {
233 _this._skipNextFocus = true;
234 }
235 activeCell.focus();
236 }
237 });
238 });
239 };
240 /** Gets whether a value is the start of the main range. */
241 MatCalendarBody.prototype._isRangeStart = function (value) {
242 return isStart(value, this.startValue, this.endValue);
243 };
244 /** Gets whether a value is the end of the main range. */
245 MatCalendarBody.prototype._isRangeEnd = function (value) {
246 return isEnd(value, this.startValue, this.endValue);
247 };
248 /** Gets whether a value is within the currently-selected range. */
249 MatCalendarBody.prototype._isInRange = function (value) {
250 return isInRange(value, this.startValue, this.endValue, this.isRange);
251 };
252 /** Gets whether a value is the start of the comparison range. */
253 MatCalendarBody.prototype._isComparisonStart = function (value) {
254 return isStart(value, this.comparisonStart, this.comparisonEnd);
255 };
256 /** Whether the cell is a start bridge cell between the main and comparison ranges. */
257 MatCalendarBody.prototype._isComparisonBridgeStart = function (value, rowIndex, colIndex) {
258 if (!this._isComparisonStart(value) || this._isRangeStart(value) || !this._isInRange(value)) {
259 return false;
260 }
261 var previousCell = this.rows[rowIndex][colIndex - 1];
262 if (!previousCell) {
263 var previousRow = this.rows[rowIndex - 1];
264 previousCell = previousRow && previousRow[previousRow.length - 1];
265 }
266 return previousCell && !this._isRangeEnd(previousCell.compareValue);
267 };
268 /** Whether the cell is an end bridge cell between the main and comparison ranges. */
269 MatCalendarBody.prototype._isComparisonBridgeEnd = function (value, rowIndex, colIndex) {
270 if (!this._isComparisonEnd(value) || this._isRangeEnd(value) || !this._isInRange(value)) {
271 return false;
272 }
273 var nextCell = this.rows[rowIndex][colIndex + 1];
274 if (!nextCell) {
275 var nextRow = this.rows[rowIndex + 1];
276 nextCell = nextRow && nextRow[0];
277 }
278 return nextCell && !this._isRangeStart(nextCell.compareValue);
279 };
280 /** Gets whether a value is the end of the comparison range. */
281 MatCalendarBody.prototype._isComparisonEnd = function (value) {
282 return isEnd(value, this.comparisonStart, this.comparisonEnd);
283 };
284 /** Gets whether a value is within the current comparison range. */
285 MatCalendarBody.prototype._isInComparisonRange = function (value) {
286 return isInRange(value, this.comparisonStart, this.comparisonEnd, this.isRange);
287 };
288 /**
289 * Gets whether a value is the same as the start and end of the comparison range.
290 * For context, the functions that we use to determine whether something is the start/end of
291 * a range don't allow for the start and end to be on the same day, because we'd have to use
292 * much more specific CSS selectors to style them correctly in all scenarios. This is fine for
293 * the regular range, because when it happens, the selected styles take over and still show where
294 * the range would've been, however we don't have these selected styles for a comparison range.
295 * This function is used to apply a class that serves the same purpose as the one for selected
296 * dates, but it only applies in the context of a comparison range.
297 */
298 MatCalendarBody.prototype._isComparisonIdentical = function (value) {
299 // Note that we don't need to null check the start/end
300 // here, because the `value` will always be defined.
301 return this.comparisonStart === this.comparisonEnd && value === this.comparisonStart;
302 };
303 /** Gets whether a value is the start of the preview range. */
304 MatCalendarBody.prototype._isPreviewStart = function (value) {
305 return isStart(value, this.previewStart, this.previewEnd);
306 };
307 /** Gets whether a value is the end of the preview range. */
308 MatCalendarBody.prototype._isPreviewEnd = function (value) {
309 return isEnd(value, this.previewStart, this.previewEnd);
310 };
311 /** Gets whether a value is inside the preview range. */
312 MatCalendarBody.prototype._isInPreview = function (value) {
313 return isInRange(value, this.previewStart, this.previewEnd, this.isRange);
314 };
315 /** Finds the MatCalendarCell that corresponds to a DOM node. */
316 MatCalendarBody.prototype._getCellFromElement = function (element) {
317 var cell;
318 if (isTableCell(element)) {
319 cell = element;
320 }
321 else if (isTableCell(element.parentNode)) {
322 cell = element.parentNode;
323 }
324 if (cell) {
325 var row = cell.getAttribute('data-mat-row');
326 var col = cell.getAttribute('data-mat-col');
327 if (row && col) {
328 return this.rows[parseInt(row)][parseInt(col)];
329 }
330 }
331 return null;
332 };
333 return MatCalendarBody;
334 }());
335 MatCalendarBody.decorators = [
336 { type: i0.Component, args: [{
337 selector: '[mat-calendar-body]',
338 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=\"mat-calendar-body-label\"\n [attr.colspan]=\"numCols\"\n [style.paddingTop]=\"_cellPadding\"\n [style.paddingBottom]=\"_cellPadding\">\n {{label}}\n </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 This cell is purely decorative, but we can't put `aria-hidden` or `role=\"presentation\"` on it,\n because it throws off the week days for the rest of the row on NVDA. The aspect ratio of the\n table cells is maintained by setting the top and bottom padding as a percentage of the width\n (a variant of the trick described here: https://www.w3schools.com/howto/howto_css_aspect_ratio.asp).\n -->\n <td *ngIf=\"rowIndex === 0 && _firstRowOffset\"\n class=\"mat-calendar-body-label\"\n [attr.colspan]=\"_firstRowOffset\"\n [style.paddingTop]=\"_cellPadding\"\n [style.paddingBottom]=\"_cellPadding\">\n {{_firstRowOffset >= labelMinRequiredCells ? label : ''}}\n </td>\n <td *ngFor=\"let item of row; let colIndex = index\"\n role=\"gridcell\"\n class=\"mat-calendar-body-cell\"\n [ngClass]=\"item.cssClasses\"\n [tabindex]=\"_isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n [attr.data-mat-row]=\"rowIndex\"\n [attr.data-mat-col]=\"colIndex\"\n [class.mat-calendar-body-disabled]=\"!item.enabled\"\n [class.mat-calendar-body-active]=\"_isActiveCell(rowIndex, colIndex)\"\n [class.mat-calendar-body-range-start]=\"_isRangeStart(item.compareValue)\"\n [class.mat-calendar-body-range-end]=\"_isRangeEnd(item.compareValue)\"\n [class.mat-calendar-body-in-range]=\"_isInRange(item.compareValue)\"\n [class.mat-calendar-body-comparison-bridge-start]=\"_isComparisonBridgeStart(item.compareValue, rowIndex, colIndex)\"\n [class.mat-calendar-body-comparison-bridge-end]=\"_isComparisonBridgeEnd(item.compareValue, rowIndex, colIndex)\"\n [class.mat-calendar-body-comparison-start]=\"_isComparisonStart(item.compareValue)\"\n [class.mat-calendar-body-comparison-end]=\"_isComparisonEnd(item.compareValue)\"\n [class.mat-calendar-body-in-comparison-range]=\"_isInComparisonRange(item.compareValue)\"\n [class.mat-calendar-body-preview-start]=\"_isPreviewStart(item.compareValue)\"\n [class.mat-calendar-body-preview-end]=\"_isPreviewEnd(item.compareValue)\"\n [class.mat-calendar-body-in-preview]=\"_isInPreview(item.compareValue)\"\n [attr.aria-label]=\"item.ariaLabel\"\n [attr.aria-disabled]=\"!item.enabled || null\"\n [attr.aria-selected]=\"_isSelected(item.compareValue)\"\n (click)=\"_cellClicked(item, $event)\"\n [style.width]=\"_cellWidth\"\n [style.paddingTop]=\"_cellPadding\"\n [style.paddingBottom]=\"_cellPadding\">\n <div class=\"mat-calendar-body-cell-content mat-focus-indicator\"\n [class.mat-calendar-body-selected]=\"_isSelected(item.compareValue)\"\n [class.mat-calendar-body-comparison-identical]=\"_isComparisonIdentical(item.compareValue)\"\n [class.mat-calendar-body-today]=\"todayValue === item.compareValue\">\n {{item.displayValue}}\n </div>\n <div class=\"mat-calendar-body-cell-preview\"></div>\n </td>\n</tr>\n",
339 host: {
340 'class': 'mat-calendar-body',
341 },
342 exportAs: 'matCalendarBody',
343 encapsulation: i0.ViewEncapsulation.None,
344 changeDetection: i0.ChangeDetectionStrategy.OnPush,
345 styles: [".mat-calendar-body{min-width:224px}.mat-calendar-body-label{height:0;line-height:0;text-align:left;padding-left:4.7142857143%;padding-right:4.7142857143%}.mat-calendar-body-cell{position:relative;height:0;line-height:0;text-align:center;outline:none;cursor:pointer}.mat-calendar-body-cell::before,.mat-calendar-body-cell::after,.mat-calendar-body-cell-preview{content:\"\";position:absolute;top:5%;left:0;z-index:0;box-sizing:border-box;height:90%;width:100%}.mat-calendar-body-range-start:not(.mat-calendar-body-in-comparison-range)::before,.mat-calendar-body-range-start::after,.mat-calendar-body-comparison-start:not(.mat-calendar-body-comparison-bridge-start)::before,.mat-calendar-body-comparison-start::after,.mat-calendar-body-preview-start .mat-calendar-body-cell-preview{left:5%;width:95%;border-top-left-radius:999px;border-bottom-left-radius:999px}[dir=rtl] .mat-calendar-body-range-start:not(.mat-calendar-body-in-comparison-range)::before,[dir=rtl] .mat-calendar-body-range-start::after,[dir=rtl] .mat-calendar-body-comparison-start:not(.mat-calendar-body-comparison-bridge-start)::before,[dir=rtl] .mat-calendar-body-comparison-start::after,[dir=rtl] .mat-calendar-body-preview-start .mat-calendar-body-cell-preview{left:0;border-radius:0;border-top-right-radius:999px;border-bottom-right-radius:999px}.mat-calendar-body-range-end:not(.mat-calendar-body-in-comparison-range)::before,.mat-calendar-body-range-end::after,.mat-calendar-body-comparison-end:not(.mat-calendar-body-comparison-bridge-end)::before,.mat-calendar-body-comparison-end::after,.mat-calendar-body-preview-end .mat-calendar-body-cell-preview{width:95%;border-top-right-radius:999px;border-bottom-right-radius:999px}[dir=rtl] .mat-calendar-body-range-end:not(.mat-calendar-body-in-comparison-range)::before,[dir=rtl] .mat-calendar-body-range-end::after,[dir=rtl] .mat-calendar-body-comparison-end:not(.mat-calendar-body-comparison-bridge-end)::before,[dir=rtl] .mat-calendar-body-comparison-end::after,[dir=rtl] .mat-calendar-body-preview-end .mat-calendar-body-cell-preview{left:5%;border-radius:0;border-top-left-radius:999px;border-bottom-left-radius:999px}[dir=rtl] .mat-calendar-body-comparison-bridge-start.mat-calendar-body-range-end::after,[dir=rtl] .mat-calendar-body-comparison-bridge-end.mat-calendar-body-range-start::after{width:95%;border-top-right-radius:999px;border-bottom-right-radius:999px}.mat-calendar-body-comparison-start.mat-calendar-body-range-end::after,[dir=rtl] .mat-calendar-body-comparison-start.mat-calendar-body-range-end::after,.mat-calendar-body-comparison-end.mat-calendar-body-range-start::after,[dir=rtl] .mat-calendar-body-comparison-end.mat-calendar-body-range-start::after{width:90%}.mat-calendar-body-in-preview .mat-calendar-body-cell-preview{border-top:dashed 1px;border-bottom:dashed 1px}.mat-calendar-body-preview-start .mat-calendar-body-cell-preview{border-left:dashed 1px}[dir=rtl] .mat-calendar-body-preview-start .mat-calendar-body-cell-preview{border-left:0;border-right:dashed 1px}.mat-calendar-body-preview-end .mat-calendar-body-cell-preview{border-right:dashed 1px}[dir=rtl] .mat-calendar-body-preview-end .mat-calendar-body-cell-preview{border-right:0;border-left:dashed 1px}.mat-calendar-body-disabled{cursor:default}.cdk-high-contrast-active .mat-calendar-body-disabled{opacity:.5}.mat-calendar-body-cell-content{top:5%;left:5%;z-index:1;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:90%;height:90%;line-height:1;border-width:1px;border-style:solid;border-radius:999px}.mat-calendar-body-cell-content.mat-focus-indicator{position:absolute}.cdk-high-contrast-active .mat-calendar-body-cell-content{border:none}.cdk-high-contrast-active .mat-datepicker-popup:not(:empty),.cdk-high-contrast-active .mat-calendar-body-cell:not(.mat-calendar-body-in-range) .mat-calendar-body-selected{outline:solid 1px}.cdk-high-contrast-active .mat-calendar-body-today{outline:dotted 1px}.cdk-high-contrast-active .cdk-keyboard-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected),.cdk-high-contrast-active .cdk-program-focused .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected){outline:dotted 2px}.cdk-high-contrast-active .mat-calendar-body-cell::before,.cdk-high-contrast-active .mat-calendar-body-cell::after,.cdk-high-contrast-active .mat-calendar-body-selected{background:none}.cdk-high-contrast-active .mat-calendar-body-in-range::before,.cdk-high-contrast-active .mat-calendar-body-comparison-bridge-start::before,.cdk-high-contrast-active .mat-calendar-body-comparison-bridge-end::before{border-top:solid 1px;border-bottom:solid 1px}.cdk-high-contrast-active .mat-calendar-body-range-start::before{border-left:solid 1px}[dir=rtl] .cdk-high-contrast-active .mat-calendar-body-range-start::before{border-left:0;border-right:solid 1px}.cdk-high-contrast-active .mat-calendar-body-range-end::before{border-right:solid 1px}[dir=rtl] .cdk-high-contrast-active .mat-calendar-body-range-end::before{border-right:0;border-left:solid 1px}.cdk-high-contrast-active .mat-calendar-body-in-comparison-range::before{border-top:dashed 1px;border-bottom:dashed 1px}.cdk-high-contrast-active .mat-calendar-body-comparison-start::before{border-left:dashed 1px}[dir=rtl] .cdk-high-contrast-active .mat-calendar-body-comparison-start::before{border-left:0;border-right:dashed 1px}.cdk-high-contrast-active .mat-calendar-body-comparison-end::before{border-right:dashed 1px}[dir=rtl] .cdk-high-contrast-active .mat-calendar-body-comparison-end::before{border-right:0;border-left:dashed 1px}[dir=rtl] .mat-calendar-body-label{text-align:right}@media(hover: none){.mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected){background-color:transparent}}\n"]
346 },] }
347 ];
348 MatCalendarBody.ctorParameters = function () { return [
349 { type: i0.ElementRef },
350 { type: i0.NgZone }
351 ]; };
352 MatCalendarBody.propDecorators = {
353 label: [{ type: i0.Input }],
354 rows: [{ type: i0.Input }],
355 todayValue: [{ type: i0.Input }],
356 startValue: [{ type: i0.Input }],
357 endValue: [{ type: i0.Input }],
358 labelMinRequiredCells: [{ type: i0.Input }],
359 numCols: [{ type: i0.Input }],
360 activeCell: [{ type: i0.Input }],
361 isRange: [{ type: i0.Input }],
362 cellAspectRatio: [{ type: i0.Input }],
363 comparisonStart: [{ type: i0.Input }],
364 comparisonEnd: [{ type: i0.Input }],
365 previewStart: [{ type: i0.Input }],
366 previewEnd: [{ type: i0.Input }],
367 selectedValueChange: [{ type: i0.Output }],
368 previewChange: [{ type: i0.Output }]
369 };
370 /** Checks whether a node is a table cell element. */
371 function isTableCell(node) {
372 return node.nodeName === 'TD';
373 }
374 /** Checks whether a value is the start of a range. */
375 function isStart(value, start, end) {
376 return end !== null && start !== end && value < end && value === start;
377 }
378 /** Checks whether a value is the end of a range. */
379 function isEnd(value, start, end) {
380 return start !== null && start !== end && value >= start && value === end;
381 }
382 /** Checks whether a value is inside of a range. */
383 function isInRange(value, start, end, rangeEnabled) {
384 return rangeEnabled && start !== null && end !== null && start !== end &&
385 value >= start && value <= end;
386 }
387
388 /*! *****************************************************************************
389 Copyright (c) Microsoft Corporation.
390
391 Permission to use, copy, modify, and/or distribute this software for any
392 purpose with or without fee is hereby granted.
393
394 THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
395 REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
396 AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
397 INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
398 LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
399 OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
400 PERFORMANCE OF THIS SOFTWARE.
401 ***************************************************************************** */
402 /* global Reflect, Promise */
403 var extendStatics = function (d, b) {
404 extendStatics = Object.setPrototypeOf ||
405 ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
406 function (d, b) { for (var p in b)
407 if (Object.prototype.hasOwnProperty.call(b, p))
408 d[p] = b[p]; };
409 return extendStatics(d, b);
410 };
411 function __extends(d, b) {
412 if (typeof b !== "function" && b !== null)
413 throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
414 extendStatics(d, b);
415 function __() { this.constructor = d; }
416 d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
417 }
418 var __assign = function () {
419 __assign = Object.assign || function __assign(t) {
420 for (var s, i = 1, n = arguments.length; i < n; i++) {
421 s = arguments[i];
422 for (var p in s)
423 if (Object.prototype.hasOwnProperty.call(s, p))
424 t[p] = s[p];
425 }
426 return t;
427 };
428 return __assign.apply(this, arguments);
429 };
430 function __rest(s, e) {
431 var t = {};
432 for (var p in s)
433 if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
434 t[p] = s[p];
435 if (s != null && typeof Object.getOwnPropertySymbols === "function")
436 for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
437 if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
438 t[p[i]] = s[p[i]];
439 }
440 return t;
441 }
442 function __decorate(decorators, target, key, desc) {
443 var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
444 if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
445 r = Reflect.decorate(decorators, target, key, desc);
446 else
447 for (var i = decorators.length - 1; i >= 0; i--)
448 if (d = decorators[i])
449 r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
450 return c > 3 && r && Object.defineProperty(target, key, r), r;
451 }
452 function __param(paramIndex, decorator) {
453 return function (target, key) { decorator(target, key, paramIndex); };
454 }
455 function __metadata(metadataKey, metadataValue) {
456 if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
457 return Reflect.metadata(metadataKey, metadataValue);
458 }
459 function __awaiter(thisArg, _arguments, P, generator) {
460 function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
461 return new (P || (P = Promise))(function (resolve, reject) {
462 function fulfilled(value) { try {
463 step(generator.next(value));
464 }
465 catch (e) {
466 reject(e);
467 } }
468 function rejected(value) { try {
469 step(generator["throw"](value));
470 }
471 catch (e) {
472 reject(e);
473 } }
474 function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
475 step((generator = generator.apply(thisArg, _arguments || [])).next());
476 });
477 }
478 function __generator(thisArg, body) {
479 var _ = { label: 0, sent: function () { if (t[0] & 1)
480 throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
481 return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function () { return this; }), g;
482 function verb(n) { return function (v) { return step([n, v]); }; }
483 function step(op) {
484 if (f)
485 throw new TypeError("Generator is already executing.");
486 while (_)
487 try {
488 if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done)
489 return t;
490 if (y = 0, t)
491 op = [op[0] & 2, t.value];
492 switch (op[0]) {
493 case 0:
494 case 1:
495 t = op;
496 break;
497 case 4:
498 _.label++;
499 return { value: op[1], done: false };
500 case 5:
501 _.label++;
502 y = op[1];
503 op = [0];
504 continue;
505 case 7:
506 op = _.ops.pop();
507 _.trys.pop();
508 continue;
509 default:
510 if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
511 _ = 0;
512 continue;
513 }
514 if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) {
515 _.label = op[1];
516 break;
517 }
518 if (op[0] === 6 && _.label < t[1]) {
519 _.label = t[1];
520 t = op;
521 break;
522 }
523 if (t && _.label < t[2]) {
524 _.label = t[2];
525 _.ops.push(op);
526 break;
527 }
528 if (t[2])
529 _.ops.pop();
530 _.trys.pop();
531 continue;
532 }
533 op = body.call(thisArg, _);
534 }
535 catch (e) {
536 op = [6, e];
537 y = 0;
538 }
539 finally {
540 f = t = 0;
541 }
542 if (op[0] & 5)
543 throw op[1];
544 return { value: op[0] ? op[1] : void 0, done: true };
545 }
546 }
547 var __createBinding = Object.create ? (function (o, m, k, k2) {
548 if (k2 === undefined)
549 k2 = k;
550 Object.defineProperty(o, k2, { enumerable: true, get: function () { return m[k]; } });
551 }) : (function (o, m, k, k2) {
552 if (k2 === undefined)
553 k2 = k;
554 o[k2] = m[k];
555 });
556 function __exportStar(m, o) {
557 for (var p in m)
558 if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p))
559 __createBinding(o, m, p);
560 }
561 function __values(o) {
562 var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
563 if (m)
564 return m.call(o);
565 if (o && typeof o.length === "number")
566 return {
567 next: function () {
568 if (o && i >= o.length)
569 o = void 0;
570 return { value: o && o[i++], done: !o };
571 }
572 };
573 throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
574 }
575 function __read(o, n) {
576 var m = typeof Symbol === "function" && o[Symbol.iterator];
577 if (!m)
578 return o;
579 var i = m.call(o), r, ar = [], e;
580 try {
581 while ((n === void 0 || n-- > 0) && !(r = i.next()).done)
582 ar.push(r.value);
583 }
584 catch (error) {
585 e = { error: error };
586 }
587 finally {
588 try {
589 if (r && !r.done && (m = i["return"]))
590 m.call(i);
591 }
592 finally {
593 if (e)
594 throw e.error;
595 }
596 }
597 return ar;
598 }
599 /** @deprecated */
600 function __spread() {
601 for (var ar = [], i = 0; i < arguments.length; i++)
602 ar = ar.concat(__read(arguments[i]));
603 return ar;
604 }
605 /** @deprecated */
606 function __spreadArrays() {
607 for (var s = 0, i = 0, il = arguments.length; i < il; i++)
608 s += arguments[i].length;
609 for (var r = Array(s), k = 0, i = 0; i < il; i++)
610 for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
611 r[k] = a[j];
612 return r;
613 }
614 function __spreadArray(to, from, pack) {
615 if (pack || arguments.length === 2)
616 for (var i = 0, l = from.length, ar; i < l; i++) {
617 if (ar || !(i in from)) {
618 if (!ar)
619 ar = Array.prototype.slice.call(from, 0, i);
620 ar[i] = from[i];
621 }
622 }
623 return to.concat(ar || from);
624 }
625 function __await(v) {
626 return this instanceof __await ? (this.v = v, this) : new __await(v);
627 }
628 function __asyncGenerator(thisArg, _arguments, generator) {
629 if (!Symbol.asyncIterator)
630 throw new TypeError("Symbol.asyncIterator is not defined.");
631 var g = generator.apply(thisArg, _arguments || []), i, q = [];
632 return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
633 function verb(n) { if (g[n])
634 i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
635 function resume(n, v) { try {
636 step(g[n](v));
637 }
638 catch (e) {
639 settle(q[0][3], e);
640 } }
641 function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
642 function fulfill(value) { resume("next", value); }
643 function reject(value) { resume("throw", value); }
644 function settle(f, v) { if (f(v), q.shift(), q.length)
645 resume(q[0][0], q[0][1]); }
646 }
647 function __asyncDelegator(o) {
648 var i, p;
649 return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
650 function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === "return" } : f ? f(v) : v; } : f; }
651 }
652 function __asyncValues(o) {
653 if (!Symbol.asyncIterator)
654 throw new TypeError("Symbol.asyncIterator is not defined.");
655 var m = o[Symbol.asyncIterator], i;
656 return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
657 function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
658 function settle(resolve, reject, d, v) { Promise.resolve(v).then(function (v) { resolve({ value: v, done: d }); }, reject); }
659 }
660 function __makeTemplateObject(cooked, raw) {
661 if (Object.defineProperty) {
662 Object.defineProperty(cooked, "raw", { value: raw });
663 }
664 else {
665 cooked.raw = raw;
666 }
667 return cooked;
668 }
669 ;
670 var __setModuleDefault = Object.create ? (function (o, v) {
671 Object.defineProperty(o, "default", { enumerable: true, value: v });
672 }) : function (o, v) {
673 o["default"] = v;
674 };
675 function __importStar(mod) {
676 if (mod && mod.__esModule)
677 return mod;
678 var result = {};
679 if (mod != null)
680 for (var k in mod)
681 if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k))
682 __createBinding(result, mod, k);
683 __setModuleDefault(result, mod);
684 return result;
685 }
686 function __importDefault(mod) {
687 return (mod && mod.__esModule) ? mod : { default: mod };
688 }
689 function __classPrivateFieldGet(receiver, state, kind, f) {
690 if (kind === "a" && !f)
691 throw new TypeError("Private accessor was defined without a getter");
692 if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
693 throw new TypeError("Cannot read private member from an object whose class did not declare it");
694 return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
695 }
696 function __classPrivateFieldSet(receiver, state, value, kind, f) {
697 if (kind === "m")
698 throw new TypeError("Private method is not writable");
699 if (kind === "a" && !f)
700 throw new TypeError("Private accessor was defined without a setter");
701 if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
702 throw new TypeError("Cannot write private member to an object whose class did not declare it");
703 return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
704 }
705
706 /** A class representing a range of dates. */
707 var DateRange = /** @class */ (function () {
708 function DateRange(
709 /** The start date of the range. */
710 start,
711 /** The end date of the range. */
712 end) {
713 this.start = start;
714 this.end = end;
715 }
716 return DateRange;
717 }());
718 /**
719 * A selection model containing a date selection.
720 * @docs-private
721 */
722 var MatDateSelectionModel = /** @class */ (function () {
723 function MatDateSelectionModel(
724 /** The current selection. */
725 selection, _adapter) {
726 this.selection = selection;
727 this._adapter = _adapter;
728 this._selectionChanged = new rxjs.Subject();
729 /** Emits when the selection has changed. */
730 this.selectionChanged = this._selectionChanged;
731 this.selection = selection;
732 }
733 /**
734 * Updates the current selection in the model.
735 * @param value New selection that should be assigned.
736 * @param source Object that triggered the selection change.
737 */
738 MatDateSelectionModel.prototype.updateSelection = function (value, source) {
739 var oldValue = this.selection;
740 this.selection = value;
741 this._selectionChanged.next({ selection: value, source: source, oldValue: oldValue });
742 };
743 MatDateSelectionModel.prototype.ngOnDestroy = function () {
744 this._selectionChanged.complete();
745 };
746 MatDateSelectionModel.prototype._isValidDateInstance = function (date) {
747 return this._adapter.isDateInstance(date) && this._adapter.isValid(date);
748 };
749 return MatDateSelectionModel;
750 }());
751 MatDateSelectionModel.decorators = [
752 { type: i0.Injectable }
753 ];
754 MatDateSelectionModel.ctorParameters = function () { return [
755 { type: undefined },
756 { type: core.DateAdapter }
757 ]; };
758 /**
759 * A selection model that contains a single date.
760 * @docs-private
761 */
762 var MatSingleDateSelectionModel = /** @class */ (function (_super) {
763 __extends(MatSingleDateSelectionModel, _super);
764 function MatSingleDateSelectionModel(adapter) {
765 return _super.call(this, null, adapter) || this;
766 }
767 /**
768 * Adds a date to the current selection. In the case of a single date selection, the added date
769 * simply overwrites the previous selection
770 */
771 MatSingleDateSelectionModel.prototype.add = function (date) {
772 _super.prototype.updateSelection.call(this, date, this);
773 };
774 /** Checks whether the current selection is valid. */
775 MatSingleDateSelectionModel.prototype.isValid = function () {
776 return this.selection != null && this._isValidDateInstance(this.selection);
777 };
778 /**
779 * Checks whether the current selection is complete. In the case of a single date selection, this
780 * is true if the current selection is not null.
781 */
782 MatSingleDateSelectionModel.prototype.isComplete = function () {
783 return this.selection != null;
784 };
785 /** Clones the selection model. */
786 MatSingleDateSelectionModel.prototype.clone = function () {
787 var clone = new MatSingleDateSelectionModel(this._adapter);
788 clone.updateSelection(this.selection, this);
789 return clone;
790 };
791 return MatSingleDateSelectionModel;
792 }(MatDateSelectionModel));
793 MatSingleDateSelectionModel.decorators = [
794 { type: i0.Injectable }
795 ];
796 MatSingleDateSelectionModel.ctorParameters = function () { return [
797 { type: core.DateAdapter }
798 ]; };
799 /**
800 * A selection model that contains a date range.
801 * @docs-private
802 */
803 var MatRangeDateSelectionModel = /** @class */ (function (_super) {
804 __extends(MatRangeDateSelectionModel, _super);
805 function MatRangeDateSelectionModel(adapter) {
806 return _super.call(this, new DateRange(null, null), adapter) || this;
807 }
808 /**
809 * Adds a date to the current selection. In the case of a date range selection, the added date
810 * fills in the next `null` value in the range. If both the start and the end already have a date,
811 * the selection is reset so that the given date is the new `start` and the `end` is null.
812 */
813 MatRangeDateSelectionModel.prototype.add = function (date) {
814 var _a = this.selection, start = _a.start, end = _a.end;
815 if (start == null) {
816 start = date;
817 }
818 else if (end == null) {
819 end = date;
820 }
821 else {
822 start = date;
823 end = null;
824 }
825 _super.prototype.updateSelection.call(this, new DateRange(start, end), this);
826 };
827 /** Checks whether the current selection is valid. */
828 MatRangeDateSelectionModel.prototype.isValid = function () {
829 var _a = this.selection, start = _a.start, end = _a.end;
830 // Empty ranges are valid.
831 if (start == null && end == null) {
832 return true;
833 }
834 // Complete ranges are only valid if both dates are valid and the start is before the end.
835 if (start != null && end != null) {
836 return this._isValidDateInstance(start) && this._isValidDateInstance(end) &&
837 this._adapter.compareDate(start, end) <= 0;
838 }
839 // Partial ranges are valid if the start/end is valid.
840 return (start == null || this._isValidDateInstance(start)) &&
841 (end == null || this._isValidDateInstance(end));
842 };
843 /**
844 * Checks whether the current selection is complete. In the case of a date range selection, this
845 * is true if the current selection has a non-null `start` and `end`.
846 */
847 MatRangeDateSelectionModel.prototype.isComplete = function () {
848 return this.selection.start != null && this.selection.end != null;
849 };
850 /** Clones the selection model. */
851 MatRangeDateSelectionModel.prototype.clone = function () {
852 var clone = new MatRangeDateSelectionModel(this._adapter);
853 clone.updateSelection(this.selection, this);
854 return clone;
855 };
856 return MatRangeDateSelectionModel;
857 }(MatDateSelectionModel));
858 MatRangeDateSelectionModel.decorators = [
859 { type: i0.Injectable }
860 ];
861 MatRangeDateSelectionModel.ctorParameters = function () { return [
862 { type: core.DateAdapter }
863 ]; };
864 /** @docs-private */
865 function MAT_SINGLE_DATE_SELECTION_MODEL_FACTORY(parent, adapter) {
866 return parent || new MatSingleDateSelectionModel(adapter);
867 }
868 /**
869 * Used to provide a single selection model to a component.
870 * @docs-private
871 */
872 var MAT_SINGLE_DATE_SELECTION_MODEL_PROVIDER = {
873 provide: MatDateSelectionModel,
874 deps: [[new i0.Optional(), new i0.SkipSelf(), MatDateSelectionModel], core.DateAdapter],
875 useFactory: MAT_SINGLE_DATE_SELECTION_MODEL_FACTORY,
876 };
877 /** @docs-private */
878 function MAT_RANGE_DATE_SELECTION_MODEL_FACTORY(parent, adapter) {
879 return parent || new MatRangeDateSelectionModel(adapter);
880 }
881 /**
882 * Used to provide a range selection model to a component.
883 * @docs-private
884 */
885 var MAT_RANGE_DATE_SELECTION_MODEL_PROVIDER = {
886 provide: MatDateSelectionModel,
887 deps: [[new i0.Optional(), new i0.SkipSelf(), MatDateSelectionModel], core.DateAdapter],
888 useFactory: MAT_RANGE_DATE_SELECTION_MODEL_FACTORY,
889 };
890
891 /**
892 * @license
893 * Copyright Google LLC All Rights Reserved.
894 *
895 * Use of this source code is governed by an MIT-style license that can be
896 * found in the LICENSE file at https://angular.io/license
897 */
898 /** Injection token used to customize the date range selection behavior. */
899 var MAT_DATE_RANGE_SELECTION_STRATEGY = new i0.InjectionToken('MAT_DATE_RANGE_SELECTION_STRATEGY');
900 /** Provides the default date range selection behavior. */
901 var DefaultMatCalendarRangeStrategy = /** @class */ (function () {
902 function DefaultMatCalendarRangeStrategy(_dateAdapter) {
903 this._dateAdapter = _dateAdapter;
904 }
905 DefaultMatCalendarRangeStrategy.prototype.selectionFinished = function (date, currentRange) {
906 var start = currentRange.start, end = currentRange.end;
907 if (start == null) {
908 start = date;
909 }
910 else if (end == null && date && this._dateAdapter.compareDate(date, start) >= 0) {
911 end = date;
912 }
913 else {
914 start = date;
915 end = null;
916 }
917 return new DateRange(start, end);
918 };
919 DefaultMatCalendarRangeStrategy.prototype.createPreview = function (activeDate, currentRange) {
920 var start = null;
921 var end = null;
922 if (currentRange.start && !currentRange.end && activeDate) {
923 start = currentRange.start;
924 end = activeDate;
925 }
926 return new DateRange(start, end);
927 };
928 return DefaultMatCalendarRangeStrategy;
929 }());
930 DefaultMatCalendarRangeStrategy.decorators = [
931 { type: i0.Injectable }
932 ];
933 DefaultMatCalendarRangeStrategy.ctorParameters = function () { return [
934 { type: core.DateAdapter }
935 ]; };
936 /** @docs-private */
937 function MAT_CALENDAR_RANGE_STRATEGY_PROVIDER_FACTORY(parent, adapter) {
938 return parent || new DefaultMatCalendarRangeStrategy(adapter);
939 }
940 /** @docs-private */
941 var MAT_CALENDAR_RANGE_STRATEGY_PROVIDER = {
942 provide: MAT_DATE_RANGE_SELECTION_STRATEGY,
943 deps: [[new i0.Optional(), new i0.SkipSelf(), MAT_DATE_RANGE_SELECTION_STRATEGY], core.DateAdapter],
944 useFactory: MAT_CALENDAR_RANGE_STRATEGY_PROVIDER_FACTORY,
945 };
946
947 /**
948 * @license
949 * Copyright Google LLC All Rights Reserved.
950 *
951 * Use of this source code is governed by an MIT-style license that can be
952 * found in the LICENSE file at https://angular.io/license
953 */
954 var DAYS_PER_WEEK = 7;
955 /**
956 * An internal component used to display a single month in the datepicker.
957 * @docs-private
958 */
959 var MatMonthView = /** @class */ (function () {
960 function MatMonthView(_changeDetectorRef, _dateFormats, _dateAdapter, _dir, _rangeStrategy) {
961 this._changeDetectorRef = _changeDetectorRef;
962 this._dateFormats = _dateFormats;
963 this._dateAdapter = _dateAdapter;
964 this._dir = _dir;
965 this._rangeStrategy = _rangeStrategy;
966 this._rerenderSubscription = rxjs.Subscription.EMPTY;
967 /** Emits when a new date is selected. */
968 this.selectedChange = new i0.EventEmitter();
969 /** Emits when any date is selected. */
970 this._userSelection = new i0.EventEmitter();
971 /** Emits when any date is activated. */
972 this.activeDateChange = new i0.EventEmitter();
973 if (typeof ngDevMode === 'undefined' || ngDevMode) {
974 if (!this._dateAdapter) {
975 throw createMissingDateImplError('DateAdapter');
976 }
977 if (!this._dateFormats) {
978 throw createMissingDateImplError('MAT_DATE_FORMATS');
979 }
980 }
981 this._activeDate = this._dateAdapter.today();
982 }
983 Object.defineProperty(MatMonthView.prototype, "activeDate", {
984 /**
985 * The date to display in this month view (everything other than the month and year is ignored).
986 */
987 get: function () { return this._activeDate; },
988 set: function (value) {
989 var oldActiveDate = this._activeDate;
990 var validDate = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value)) || this._dateAdapter.today();
991 this._activeDate = this._dateAdapter.clampDate(validDate, this.minDate, this.maxDate);
992 if (!this._hasSameMonthAndYear(oldActiveDate, this._activeDate)) {
993 this._init();
994 }
995 },
996 enumerable: false,
997 configurable: true
998 });
999 Object.defineProperty(MatMonthView.prototype, "selected", {
1000 /** The currently selected date. */
1001 get: function () { return this._selected; },
1002 set: function (value) {
1003 if (value instanceof DateRange) {
1004 this._selected = value;
1005 }
1006 else {
1007 this._selected = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
1008 }
1009 this._setRanges(this._selected);
1010 },
1011 enumerable: false,
1012 configurable: true
1013 });
1014 Object.defineProperty(MatMonthView.prototype, "minDate", {
1015 /** The minimum selectable date. */
1016 get: function () { return this._minDate; },
1017 set: function (value) {
1018 this._minDate = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
1019 },
1020 enumerable: false,
1021 configurable: true
1022 });
1023 Object.defineProperty(MatMonthView.prototype, "maxDate", {
1024 /** The maximum selectable date. */
1025 get: function () { return this._maxDate; },
1026 set: function (value) {
1027 this._maxDate = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
1028 },
1029 enumerable: false,
1030 configurable: true
1031 });
1032 MatMonthView.prototype.ngAfterContentInit = function () {
1033 var _this = this;
1034 this._rerenderSubscription = this._dateAdapter.localeChanges
1035 .pipe(operators.startWith(null))
1036 .subscribe(function () { return _this._init(); });
1037 };
1038 MatMonthView.prototype.ngOnChanges = function (changes) {
1039 var comparisonChange = changes['comparisonStart'] || changes['comparisonEnd'];
1040 if (comparisonChange && !comparisonChange.firstChange) {
1041 this._setRanges(this.selected);
1042 }
1043 };
1044 MatMonthView.prototype.ngOnDestroy = function () {
1045 this._rerenderSubscription.unsubscribe();
1046 };
1047 /** Handles when a new date is selected. */
1048 MatMonthView.prototype._dateSelected = function (event) {
1049 var date = event.value;
1050 var selectedYear = this._dateAdapter.getYear(this.activeDate);
1051 var selectedMonth = this._dateAdapter.getMonth(this.activeDate);
1052 var selectedDate = this._dateAdapter.createDate(selectedYear, selectedMonth, date);
1053 var rangeStartDate;
1054 var rangeEndDate;
1055 if (this._selected instanceof DateRange) {
1056 rangeStartDate = this._getDateInCurrentMonth(this._selected.start);
1057 rangeEndDate = this._getDateInCurrentMonth(this._selected.end);
1058 }
1059 else {
1060 rangeStartDate = rangeEndDate = this._getDateInCurrentMonth(this._selected);
1061 }
1062 if (rangeStartDate !== date || rangeEndDate !== date) {
1063 this.selectedChange.emit(selectedDate);
1064 }
1065 this._userSelection.emit({ value: selectedDate, event: event.event });
1066 this._previewStart = this._previewEnd = null;
1067 this._changeDetectorRef.markForCheck();
1068 };
1069 /** Handles keydown events on the calendar body when calendar is in month view. */
1070 MatMonthView.prototype._handleCalendarBodyKeydown = function (event) {
1071 // TODO(mmalerba): We currently allow keyboard navigation to disabled dates, but just prevent
1072 // disabled ones from being selected. This may not be ideal, we should look into whether
1073 // navigation should skip over disabled dates, and if so, how to implement that efficiently.
1074 var oldActiveDate = this._activeDate;
1075 var isRtl = this._isRtl();
1076 switch (event.keyCode) {
1077 case keycodes.LEFT_ARROW:
1078 this.activeDate = this._dateAdapter.addCalendarDays(this._activeDate, isRtl ? 1 : -1);
1079 break;
1080 case keycodes.RIGHT_ARROW:
1081 this.activeDate = this._dateAdapter.addCalendarDays(this._activeDate, isRtl ? -1 : 1);
1082 break;
1083 case keycodes.UP_ARROW:
1084 this.activeDate = this._dateAdapter.addCalendarDays(this._activeDate, -7);
1085 break;
1086 case keycodes.DOWN_ARROW:
1087 this.activeDate = this._dateAdapter.addCalendarDays(this._activeDate, 7);
1088 break;
1089 case keycodes.HOME:
1090 this.activeDate = this._dateAdapter.addCalendarDays(this._activeDate, 1 - this._dateAdapter.getDate(this._activeDate));
1091 break;
1092 case keycodes.END:
1093 this.activeDate = this._dateAdapter.addCalendarDays(this._activeDate, (this._dateAdapter.getNumDaysInMonth(this._activeDate) -
1094 this._dateAdapter.getDate(this._activeDate)));
1095 break;
1096 case keycodes.PAGE_UP:
1097 this.activeDate = event.altKey ?
1098 this._dateAdapter.addCalendarYears(this._activeDate, -1) :
1099 this._dateAdapter.addCalendarMonths(this._activeDate, -1);
1100 break;
1101 case keycodes.PAGE_DOWN:
1102 this.activeDate = event.altKey ?
1103 this._dateAdapter.addCalendarYears(this._activeDate, 1) :
1104 this._dateAdapter.addCalendarMonths(this._activeDate, 1);
1105 break;
1106 case keycodes.ENTER:
1107 case keycodes.SPACE:
1108 this._selectionKeyPressed = true;
1109 if (this._canSelect(this._activeDate)) {
1110 // Prevent unexpected default actions such as form submission.
1111 // Note that we only prevent the default action here while the selection happens in
1112 // `keyup` below. We can't do the selection here, because it can cause the calendar to
1113 // reopen if focus is restored immediately. We also can't call `preventDefault` on `keyup`
1114 // because it's too late (see #23305).
1115 event.preventDefault();
1116 }
1117 return;
1118 case keycodes.ESCAPE:
1119 // Abort the current range selection if the user presses escape mid-selection.
1120 if (this._previewEnd != null && !keycodes.hasModifierKey(event)) {
1121 this._previewStart = this._previewEnd = null;
1122 this.selectedChange.emit(null);
1123 this._userSelection.emit({ value: null, event: event });
1124 event.preventDefault();
1125 event.stopPropagation(); // Prevents the overlay from closing.
1126 }
1127 return;
1128 default:
1129 // Don't prevent default or focus active cell on keys that we don't explicitly handle.
1130 return;
1131 }
1132 if (this._dateAdapter.compareDate(oldActiveDate, this.activeDate)) {
1133 this.activeDateChange.emit(this.activeDate);
1134 }
1135 this._focusActiveCell();
1136 // Prevent unexpected default actions such as form submission.
1137 event.preventDefault();
1138 };
1139 /** Handles keyup events on the calendar body when calendar is in month view. */
1140 MatMonthView.prototype._handleCalendarBodyKeyup = function (event) {
1141 if (event.keyCode === keycodes.SPACE || event.keyCode === keycodes.ENTER) {
1142 if (this._selectionKeyPressed && this._canSelect(this._activeDate)) {
1143 this._dateSelected({ value: this._dateAdapter.getDate(this._activeDate), event: event });
1144 }
1145 this._selectionKeyPressed = false;
1146 }
1147 };
1148 /** Initializes this month view. */
1149 MatMonthView.prototype._init = function () {
1150 this._setRanges(this.selected);
1151 this._todayDate = this._getCellCompareValue(this._dateAdapter.today());
1152 this._monthLabel = this._dateFormats.display.monthLabel
1153 ? this._dateAdapter.format(this.activeDate, this._dateFormats.display.monthLabel)
1154 : this._dateAdapter.getMonthNames('short')[this._dateAdapter.getMonth(this.activeDate)]
1155 .toLocaleUpperCase();
1156 var firstOfMonth = this._dateAdapter.createDate(this._dateAdapter.getYear(this.activeDate), this._dateAdapter.getMonth(this.activeDate), 1);
1157 this._firstWeekOffset =
1158 (DAYS_PER_WEEK + this._dateAdapter.getDayOfWeek(firstOfMonth) -
1159 this._dateAdapter.getFirstDayOfWeek()) % DAYS_PER_WEEK;
1160 this._initWeekdays();
1161 this._createWeekCells();
1162 this._changeDetectorRef.markForCheck();
1163 };
1164 /** Focuses the active cell after the microtask queue is empty. */
1165 MatMonthView.prototype._focusActiveCell = function (movePreview) {
1166 this._matCalendarBody._focusActiveCell(movePreview);
1167 };
1168 /** Called when the user has activated a new cell and the preview needs to be updated. */
1169 MatMonthView.prototype._previewChanged = function (_a) {
1170 var event = _a.event, cell = _a.value;
1171 if (this._rangeStrategy) {
1172 // We can assume that this will be a range, because preview
1173 // events aren't fired for single date selections.
1174 var value = cell ? cell.rawValue : null;
1175 var previewRange = this._rangeStrategy.createPreview(value, this.selected, event);
1176 this._previewStart = this._getCellCompareValue(previewRange.start);
1177 this._previewEnd = this._getCellCompareValue(previewRange.end);
1178 // Note that here we need to use `detectChanges`, rather than `markForCheck`, because
1179 // the way `_focusActiveCell` is set up at the moment makes it fire at the wrong time
1180 // when navigating one month back using the keyboard which will cause this handler
1181 // to throw a "changed after checked" error when updating the preview state.
1182 this._changeDetectorRef.detectChanges();
1183 }
1184 };
1185 /** Initializes the weekdays. */
1186 MatMonthView.prototype._initWeekdays = function () {
1187 var firstDayOfWeek = this._dateAdapter.getFirstDayOfWeek();
1188 var narrowWeekdays = this._dateAdapter.getDayOfWeekNames('narrow');
1189 var longWeekdays = this._dateAdapter.getDayOfWeekNames('long');
1190 // Rotate the labels for days of the week based on the configured first day of the week.
1191 var weekdays = longWeekdays.map(function (long, i) {
1192 return { long: long, narrow: narrowWeekdays[i] };
1193 });
1194 this._weekdays = weekdays.slice(firstDayOfWeek).concat(weekdays.slice(0, firstDayOfWeek));
1195 };
1196 /** Creates MatCalendarCells for the dates in this month. */
1197 MatMonthView.prototype._createWeekCells = function () {
1198 var daysInMonth = this._dateAdapter.getNumDaysInMonth(this.activeDate);
1199 var dateNames = this._dateAdapter.getDateNames();
1200 this._weeks = [[]];
1201 for (var i = 0, cell = this._firstWeekOffset; i < daysInMonth; i++, cell++) {
1202 if (cell == DAYS_PER_WEEK) {
1203 this._weeks.push([]);
1204 cell = 0;
1205 }
1206 var date = this._dateAdapter.createDate(this._dateAdapter.getYear(this.activeDate), this._dateAdapter.getMonth(this.activeDate), i + 1);
1207 var enabled = this._shouldEnableDate(date);
1208 var ariaLabel = this._dateAdapter.format(date, this._dateFormats.display.dateA11yLabel);
1209 var cellClasses = this.dateClass ? this.dateClass(date, 'month') : undefined;
1210 this._weeks[this._weeks.length - 1].push(new MatCalendarCell(i + 1, dateNames[i], ariaLabel, enabled, cellClasses, this._getCellCompareValue(date), date));
1211 }
1212 };
1213 /** Date filter for the month */
1214 MatMonthView.prototype._shouldEnableDate = function (date) {
1215 return !!date &&
1216 (!this.minDate || this._dateAdapter.compareDate(date, this.minDate) >= 0) &&
1217 (!this.maxDate || this._dateAdapter.compareDate(date, this.maxDate) <= 0) &&
1218 (!this.dateFilter || this.dateFilter(date));
1219 };
1220 /**
1221 * Gets the date in this month that the given Date falls on.
1222 * Returns null if the given Date is in another month.
1223 */
1224 MatMonthView.prototype._getDateInCurrentMonth = function (date) {
1225 return date && this._hasSameMonthAndYear(date, this.activeDate) ?
1226 this._dateAdapter.getDate(date) : null;
1227 };
1228 /** Checks whether the 2 dates are non-null and fall within the same month of the same year. */
1229 MatMonthView.prototype._hasSameMonthAndYear = function (d1, d2) {
1230 return !!(d1 && d2 && this._dateAdapter.getMonth(d1) == this._dateAdapter.getMonth(d2) &&
1231 this._dateAdapter.getYear(d1) == this._dateAdapter.getYear(d2));
1232 };
1233 /** Gets the value that will be used to one cell to another. */
1234 MatMonthView.prototype._getCellCompareValue = function (date) {
1235 if (date) {
1236 // We use the time since the Unix epoch to compare dates in this view, rather than the
1237 // cell values, because we need to support ranges that span across multiple months/years.
1238 var year = this._dateAdapter.getYear(date);
1239 var month = this._dateAdapter.getMonth(date);
1240 var day = this._dateAdapter.getDate(date);
1241 return new Date(year, month, day).getTime();
1242 }
1243 return null;
1244 };
1245 /** Determines whether the user has the RTL layout direction. */
1246 MatMonthView.prototype._isRtl = function () {
1247 return this._dir && this._dir.value === 'rtl';
1248 };
1249 /** Sets the current range based on a model value. */
1250 MatMonthView.prototype._setRanges = function (selectedValue) {
1251 if (selectedValue instanceof DateRange) {
1252 this._rangeStart = this._getCellCompareValue(selectedValue.start);
1253 this._rangeEnd = this._getCellCompareValue(selectedValue.end);
1254 this._isRange = true;
1255 }
1256 else {
1257 this._rangeStart = this._rangeEnd = this._getCellCompareValue(selectedValue);
1258 this._isRange = false;
1259 }
1260 this._comparisonRangeStart = this._getCellCompareValue(this.comparisonStart);
1261 this._comparisonRangeEnd = this._getCellCompareValue(this.comparisonEnd);
1262 };
1263 /** Gets whether a date can be selected in the month view. */
1264 MatMonthView.prototype._canSelect = function (date) {
1265 return !this.dateFilter || this.dateFilter(date);
1266 };
1267 return MatMonthView;
1268 }());
1269 MatMonthView.decorators = [
1270 { type: i0.Component, args: [{
1271 selector: 'mat-month-view',
1272 template: "<table class=\"mat-calendar-table\" role=\"grid\">\n <thead class=\"mat-calendar-table-header\">\n <tr>\n <!-- For the day-of-the-week column header, we use an `<abbr>` element because VoiceOver\n ignores the `aria-label`. ChromeVox, however, does not read the full name\n for the `<abbr>`, so we still set `aria-label` on the header element. -->\n <th scope=\"col\" *ngFor=\"let day of _weekdays\" [attr.aria-label]=\"day.long\">\n <abbr class=\"mat-calendar-abbr\" [attr.title]=\"day.long\">{{day.narrow}}</abbr>\n </th>\n </tr>\n <tr><th aria-hidden=\"true\" class=\"mat-calendar-table-header-divider\" colspan=\"7\"></th></tr>\n </thead>\n <tbody mat-calendar-body\n [label]=\"_monthLabel\"\n [rows]=\"_weeks\"\n [todayValue]=\"_todayDate!\"\n [startValue]=\"_rangeStart!\"\n [endValue]=\"_rangeEnd!\"\n [comparisonStart]=\"_comparisonRangeStart\"\n [comparisonEnd]=\"_comparisonRangeEnd\"\n [previewStart]=\"_previewStart\"\n [previewEnd]=\"_previewEnd\"\n [isRange]=\"_isRange\"\n [labelMinRequiredCells]=\"3\"\n [activeCell]=\"_dateAdapter.getDate(activeDate) - 1\"\n (selectedValueChange)=\"_dateSelected($event)\"\n (previewChange)=\"_previewChanged($event)\"\n (keyup)=\"_handleCalendarBodyKeyup($event)\"\n (keydown)=\"_handleCalendarBodyKeydown($event)\">\n </tbody>\n</table>\n",
1273 exportAs: 'matMonthView',
1274 encapsulation: i0.ViewEncapsulation.None,
1275 changeDetection: i0.ChangeDetectionStrategy.OnPush
1276 },] }
1277 ];
1278 MatMonthView.ctorParameters = function () { return [
1279 { type: i0.ChangeDetectorRef },
1280 { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [core.MAT_DATE_FORMATS,] }] },
1281 { type: core.DateAdapter, decorators: [{ type: i0.Optional }] },
1282 { type: bidi.Directionality, decorators: [{ type: i0.Optional }] },
1283 { type: undefined, decorators: [{ type: i0.Inject, args: [MAT_DATE_RANGE_SELECTION_STRATEGY,] }, { type: i0.Optional }] }
1284 ]; };
1285 MatMonthView.propDecorators = {
1286 activeDate: [{ type: i0.Input }],
1287 selected: [{ type: i0.Input }],
1288 minDate: [{ type: i0.Input }],
1289 maxDate: [{ type: i0.Input }],
1290 dateFilter: [{ type: i0.Input }],
1291 dateClass: [{ type: i0.Input }],
1292 comparisonStart: [{ type: i0.Input }],
1293 comparisonEnd: [{ type: i0.Input }],
1294 selectedChange: [{ type: i0.Output }],
1295 _userSelection: [{ type: i0.Output }],
1296 activeDateChange: [{ type: i0.Output }],
1297 _matCalendarBody: [{ type: i0.ViewChild, args: [MatCalendarBody,] }]
1298 };
1299
1300 /**
1301 * @license
1302 * Copyright Google LLC All Rights Reserved.
1303 *
1304 * Use of this source code is governed by an MIT-style license that can be
1305 * found in the LICENSE file at https://angular.io/license
1306 */
1307 var yearsPerPage = 24;
1308 var yearsPerRow = 4;
1309 /**
1310 * An internal component used to display a year selector in the datepicker.
1311 * @docs-private
1312 */
1313 var MatMultiYearView = /** @class */ (function () {
1314 function MatMultiYearView(_changeDetectorRef, _dateAdapter, _dir) {
1315 this._changeDetectorRef = _changeDetectorRef;
1316 this._dateAdapter = _dateAdapter;
1317 this._dir = _dir;
1318 this._rerenderSubscription = rxjs.Subscription.EMPTY;
1319 /** Emits when a new year is selected. */
1320 this.selectedChange = new i0.EventEmitter();
1321 /** Emits the selected year. This doesn't imply a change on the selected date */
1322 this.yearSelected = new i0.EventEmitter();
1323 /** Emits when any date is activated. */
1324 this.activeDateChange = new i0.EventEmitter();
1325 if (!this._dateAdapter && (typeof ngDevMode === 'undefined' || ngDevMode)) {
1326 throw createMissingDateImplError('DateAdapter');
1327 }
1328 this._activeDate = this._dateAdapter.today();
1329 }
1330 Object.defineProperty(MatMultiYearView.prototype, "activeDate", {
1331 /** The date to display in this multi-year view (everything other than the year is ignored). */
1332 get: function () { return this._activeDate; },
1333 set: function (value) {
1334 var oldActiveDate = this._activeDate;
1335 var validDate = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value)) || this._dateAdapter.today();
1336 this._activeDate = this._dateAdapter.clampDate(validDate, this.minDate, this.maxDate);
1337 if (!isSameMultiYearView(this._dateAdapter, oldActiveDate, this._activeDate, this.minDate, this.maxDate)) {
1338 this._init();
1339 }
1340 },
1341 enumerable: false,
1342 configurable: true
1343 });
1344 Object.defineProperty(MatMultiYearView.prototype, "selected", {
1345 /** The currently selected date. */
1346 get: function () { return this._selected; },
1347 set: function (value) {
1348 if (value instanceof DateRange) {
1349 this._selected = value;
1350 }
1351 else {
1352 this._selected = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
1353 }
1354 this._setSelectedYear(value);
1355 },
1356 enumerable: false,
1357 configurable: true
1358 });
1359 Object.defineProperty(MatMultiYearView.prototype, "minDate", {
1360 /** The minimum selectable date. */
1361 get: function () { return this._minDate; },
1362 set: function (value) {
1363 this._minDate = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
1364 },
1365 enumerable: false,
1366 configurable: true
1367 });
1368 Object.defineProperty(MatMultiYearView.prototype, "maxDate", {
1369 /** The maximum selectable date. */
1370 get: function () { return this._maxDate; },
1371 set: function (value) {
1372 this._maxDate = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
1373 },
1374 enumerable: false,
1375 configurable: true
1376 });
1377 MatMultiYearView.prototype.ngAfterContentInit = function () {
1378 var _this = this;
1379 this._rerenderSubscription = this._dateAdapter.localeChanges
1380 .pipe(operators.startWith(null))
1381 .subscribe(function () { return _this._init(); });
1382 };
1383 MatMultiYearView.prototype.ngOnDestroy = function () {
1384 this._rerenderSubscription.unsubscribe();
1385 };
1386 /** Initializes this multi-year view. */
1387 MatMultiYearView.prototype._init = function () {
1388 var _this = this;
1389 this._todayYear = this._dateAdapter.getYear(this._dateAdapter.today());
1390 // We want a range years such that we maximize the number of
1391 // enabled dates visible at once. This prevents issues where the minimum year
1392 // is the last item of a page OR the maximum year is the first item of a page.
1393 // The offset from the active year to the "slot" for the starting year is the
1394 // *actual* first rendered year in the multi-year view.
1395 var activeYear = this._dateAdapter.getYear(this._activeDate);
1396 var minYearOfPage = activeYear - getActiveOffset(this._dateAdapter, this.activeDate, this.minDate, this.maxDate);
1397 this._years = [];
1398 for (var i = 0, row = []; i < yearsPerPage; i++) {
1399 row.push(minYearOfPage + i);
1400 if (row.length == yearsPerRow) {
1401 this._years.push(row.map(function (year) { return _this._createCellForYear(year); }));
1402 row = [];
1403 }
1404 }
1405 this._changeDetectorRef.markForCheck();
1406 };
1407 /** Handles when a new year is selected. */
1408 MatMultiYearView.prototype._yearSelected = function (event) {
1409 var year = event.value;
1410 this.yearSelected.emit(this._dateAdapter.createDate(year, 0, 1));
1411 var month = this._dateAdapter.getMonth(this.activeDate);
1412 var daysInMonth = this._dateAdapter.getNumDaysInMonth(this._dateAdapter.createDate(year, month, 1));
1413 this.selectedChange.emit(this._dateAdapter.createDate(year, month, Math.min(this._dateAdapter.getDate(this.activeDate), daysInMonth)));
1414 };
1415 /** Handles keydown events on the calendar body when calendar is in multi-year view. */
1416 MatMultiYearView.prototype._handleCalendarBodyKeydown = function (event) {
1417 var oldActiveDate = this._activeDate;
1418 var isRtl = this._isRtl();
1419 switch (event.keyCode) {
1420 case keycodes.LEFT_ARROW:
1421 this.activeDate = this._dateAdapter.addCalendarYears(this._activeDate, isRtl ? 1 : -1);
1422 break;
1423 case keycodes.RIGHT_ARROW:
1424 this.activeDate = this._dateAdapter.addCalendarYears(this._activeDate, isRtl ? -1 : 1);
1425 break;
1426 case keycodes.UP_ARROW:
1427 this.activeDate = this._dateAdapter.addCalendarYears(this._activeDate, -yearsPerRow);
1428 break;
1429 case keycodes.DOWN_ARROW:
1430 this.activeDate = this._dateAdapter.addCalendarYears(this._activeDate, yearsPerRow);
1431 break;
1432 case keycodes.HOME:
1433 this.activeDate = this._dateAdapter.addCalendarYears(this._activeDate, -getActiveOffset(this._dateAdapter, this.activeDate, this.minDate, this.maxDate));
1434 break;
1435 case keycodes.END:
1436 this.activeDate = this._dateAdapter.addCalendarYears(this._activeDate, yearsPerPage - getActiveOffset(this._dateAdapter, this.activeDate, this.minDate, this.maxDate) - 1);
1437 break;
1438 case keycodes.PAGE_UP:
1439 this.activeDate =
1440 this._dateAdapter.addCalendarYears(this._activeDate, event.altKey ? -yearsPerPage * 10 : -yearsPerPage);
1441 break;
1442 case keycodes.PAGE_DOWN:
1443 this.activeDate =
1444 this._dateAdapter.addCalendarYears(this._activeDate, event.altKey ? yearsPerPage * 10 : yearsPerPage);
1445 break;
1446 case keycodes.ENTER:
1447 case keycodes.SPACE:
1448 // Note that we only prevent the default action here while the selection happens in
1449 // `keyup` below. We can't do the selection here, because it can cause the calendar to
1450 // reopen if focus is restored immediately. We also can't call `preventDefault` on `keyup`
1451 // because it's too late (see #23305).
1452 this._selectionKeyPressed = true;
1453 break;
1454 default:
1455 // Don't prevent default or focus active cell on keys that we don't explicitly handle.
1456 return;
1457 }
1458 if (this._dateAdapter.compareDate(oldActiveDate, this.activeDate)) {
1459 this.activeDateChange.emit(this.activeDate);
1460 }
1461 this._focusActiveCell();
1462 // Prevent unexpected default actions such as form submission.
1463 event.preventDefault();
1464 };
1465 /** Handles keyup events on the calendar body when calendar is in multi-year view. */
1466 MatMultiYearView.prototype._handleCalendarBodyKeyup = function (event) {
1467 if (event.keyCode === keycodes.SPACE || event.keyCode === keycodes.ENTER) {
1468 if (this._selectionKeyPressed) {
1469 this._yearSelected({ value: this._dateAdapter.getYear(this._activeDate), event: event });
1470 }
1471 this._selectionKeyPressed = false;
1472 }
1473 };
1474 MatMultiYearView.prototype._getActiveCell = function () {
1475 return getActiveOffset(this._dateAdapter, this.activeDate, this.minDate, this.maxDate);
1476 };
1477 /** Focuses the active cell after the microtask queue is empty. */
1478 MatMultiYearView.prototype._focusActiveCell = function () {
1479 this._matCalendarBody._focusActiveCell();
1480 };
1481 /** Creates an MatCalendarCell for the given year. */
1482 MatMultiYearView.prototype._createCellForYear = function (year) {
1483 var date = this._dateAdapter.createDate(year, 0, 1);
1484 var yearName = this._dateAdapter.getYearName(date);
1485 var cellClasses = this.dateClass ? this.dateClass(date, 'multi-year') : undefined;
1486 return new MatCalendarCell(year, yearName, yearName, this._shouldEnableYear(year), cellClasses);
1487 };
1488 /** Whether the given year is enabled. */
1489 MatMultiYearView.prototype._shouldEnableYear = function (year) {
1490 // disable if the year is greater than maxDate lower than minDate
1491 if (year === undefined || year === null ||
1492 (this.maxDate && year > this._dateAdapter.getYear(this.maxDate)) ||
1493 (this.minDate && year < this._dateAdapter.getYear(this.minDate))) {
1494 return false;
1495 }
1496 // enable if it reaches here and there's no filter defined
1497 if (!this.dateFilter) {
1498 return true;
1499 }
1500 var firstOfYear = this._dateAdapter.createDate(year, 0, 1);
1501 // If any date in the year is enabled count the year as enabled.
1502 for (var date = firstOfYear; this._dateAdapter.getYear(date) == year; date = this._dateAdapter.addCalendarDays(date, 1)) {
1503 if (this.dateFilter(date)) {
1504 return true;
1505 }
1506 }
1507 return false;
1508 };
1509 /** Determines whether the user has the RTL layout direction. */
1510 MatMultiYearView.prototype._isRtl = function () {
1511 return this._dir && this._dir.value === 'rtl';
1512 };
1513 /** Sets the currently-highlighted year based on a model value. */
1514 MatMultiYearView.prototype._setSelectedYear = function (value) {
1515 this._selectedYear = null;
1516 if (value instanceof DateRange) {
1517 var displayValue = value.start || value.end;
1518 if (displayValue) {
1519 this._selectedYear = this._dateAdapter.getYear(displayValue);
1520 }
1521 }
1522 else if (value) {
1523 this._selectedYear = this._dateAdapter.getYear(value);
1524 }
1525 };
1526 return MatMultiYearView;
1527 }());
1528 MatMultiYearView.decorators = [
1529 { type: i0.Component, args: [{
1530 selector: 'mat-multi-year-view',
1531 template: "<table class=\"mat-calendar-table\" role=\"grid\">\n <thead aria-hidden=\"true\" class=\"mat-calendar-table-header\">\n <tr><th class=\"mat-calendar-table-header-divider\" colspan=\"4\"></th></tr>\n </thead>\n <tbody mat-calendar-body\n [rows]=\"_years\"\n [todayValue]=\"_todayYear\"\n [startValue]=\"_selectedYear!\"\n [endValue]=\"_selectedYear!\"\n [numCols]=\"4\"\n [cellAspectRatio]=\"4 / 7\"\n [activeCell]=\"_getActiveCell()\"\n (selectedValueChange)=\"_yearSelected($event)\"\n (keyup)=\"_handleCalendarBodyKeyup($event)\"\n (keydown)=\"_handleCalendarBodyKeydown($event)\">\n </tbody>\n</table>\n",
1532 exportAs: 'matMultiYearView',
1533 encapsulation: i0.ViewEncapsulation.None,
1534 changeDetection: i0.ChangeDetectionStrategy.OnPush
1535 },] }
1536 ];
1537 MatMultiYearView.ctorParameters = function () { return [
1538 { type: i0.ChangeDetectorRef },
1539 { type: core.DateAdapter, decorators: [{ type: i0.Optional }] },
1540 { type: bidi.Directionality, decorators: [{ type: i0.Optional }] }
1541 ]; };
1542 MatMultiYearView.propDecorators = {
1543 activeDate: [{ type: i0.Input }],
1544 selected: [{ type: i0.Input }],
1545 minDate: [{ type: i0.Input }],
1546 maxDate: [{ type: i0.Input }],
1547 dateFilter: [{ type: i0.Input }],
1548 dateClass: [{ type: i0.Input }],
1549 selectedChange: [{ type: i0.Output }],
1550 yearSelected: [{ type: i0.Output }],
1551 activeDateChange: [{ type: i0.Output }],
1552 _matCalendarBody: [{ type: i0.ViewChild, args: [MatCalendarBody,] }]
1553 };
1554 function isSameMultiYearView(dateAdapter, date1, date2, minDate, maxDate) {
1555 var year1 = dateAdapter.getYear(date1);
1556 var year2 = dateAdapter.getYear(date2);
1557 var startingYear = getStartingYear(dateAdapter, minDate, maxDate);
1558 return Math.floor((year1 - startingYear) / yearsPerPage) ===
1559 Math.floor((year2 - startingYear) / yearsPerPage);
1560 }
1561 /**
1562 * When the multi-year view is first opened, the active year will be in view.
1563 * So we compute how many years are between the active year and the *slot* where our
1564 * "startingYear" will render when paged into view.
1565 */
1566 function getActiveOffset(dateAdapter, activeDate, minDate, maxDate) {
1567 var activeYear = dateAdapter.getYear(activeDate);
1568 return euclideanModulo((activeYear - getStartingYear(dateAdapter, minDate, maxDate)), yearsPerPage);
1569 }
1570 /**
1571 * We pick a "starting" year such that either the maximum year would be at the end
1572 * or the minimum year would be at the beginning of a page.
1573 */
1574 function getStartingYear(dateAdapter, minDate, maxDate) {
1575 var startingYear = 0;
1576 if (maxDate) {
1577 var maxYear = dateAdapter.getYear(maxDate);
1578 startingYear = maxYear - yearsPerPage + 1;
1579 }
1580 else if (minDate) {
1581 startingYear = dateAdapter.getYear(minDate);
1582 }
1583 return startingYear;
1584 }
1585 /** Gets remainder that is non-negative, even if first number is negative */
1586 function euclideanModulo(a, b) {
1587 return (a % b + b) % b;
1588 }
1589
1590 /**
1591 * @license
1592 * Copyright Google LLC All Rights Reserved.
1593 *
1594 * Use of this source code is governed by an MIT-style license that can be
1595 * found in the LICENSE file at https://angular.io/license
1596 */
1597 /**
1598 * An internal component used to display a single year in the datepicker.
1599 * @docs-private
1600 */
1601 var MatYearView = /** @class */ (function () {
1602 function MatYearView(_changeDetectorRef, _dateFormats, _dateAdapter, _dir) {
1603 this._changeDetectorRef = _changeDetectorRef;
1604 this._dateFormats = _dateFormats;
1605 this._dateAdapter = _dateAdapter;
1606 this._dir = _dir;
1607 this._rerenderSubscription = rxjs.Subscription.EMPTY;
1608 /** Emits when a new month is selected. */
1609 this.selectedChange = new i0.EventEmitter();
1610 /** Emits the selected month. This doesn't imply a change on the selected date */
1611 this.monthSelected = new i0.EventEmitter();
1612 /** Emits when any date is activated. */
1613 this.activeDateChange = new i0.EventEmitter();
1614 if (typeof ngDevMode === 'undefined' || ngDevMode) {
1615 if (!this._dateAdapter) {
1616 throw createMissingDateImplError('DateAdapter');
1617 }
1618 if (!this._dateFormats) {
1619 throw createMissingDateImplError('MAT_DATE_FORMATS');
1620 }
1621 }
1622 this._activeDate = this._dateAdapter.today();
1623 }
1624 Object.defineProperty(MatYearView.prototype, "activeDate", {
1625 /** The date to display in this year view (everything other than the year is ignored). */
1626 get: function () { return this._activeDate; },
1627 set: function (value) {
1628 var oldActiveDate = this._activeDate;
1629 var validDate = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value)) || this._dateAdapter.today();
1630 this._activeDate = this._dateAdapter.clampDate(validDate, this.minDate, this.maxDate);
1631 if (this._dateAdapter.getYear(oldActiveDate) !== this._dateAdapter.getYear(this._activeDate)) {
1632 this._init();
1633 }
1634 },
1635 enumerable: false,
1636 configurable: true
1637 });
1638 Object.defineProperty(MatYearView.prototype, "selected", {
1639 /** The currently selected date. */
1640 get: function () { return this._selected; },
1641 set: function (value) {
1642 if (value instanceof DateRange) {
1643 this._selected = value;
1644 }
1645 else {
1646 this._selected = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
1647 }
1648 this._setSelectedMonth(value);
1649 },
1650 enumerable: false,
1651 configurable: true
1652 });
1653 Object.defineProperty(MatYearView.prototype, "minDate", {
1654 /** The minimum selectable date. */
1655 get: function () { return this._minDate; },
1656 set: function (value) {
1657 this._minDate = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
1658 },
1659 enumerable: false,
1660 configurable: true
1661 });
1662 Object.defineProperty(MatYearView.prototype, "maxDate", {
1663 /** The maximum selectable date. */
1664 get: function () { return this._maxDate; },
1665 set: function (value) {
1666 this._maxDate = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
1667 },
1668 enumerable: false,
1669 configurable: true
1670 });
1671 MatYearView.prototype.ngAfterContentInit = function () {
1672 var _this = this;
1673 this._rerenderSubscription = this._dateAdapter.localeChanges
1674 .pipe(operators.startWith(null))
1675 .subscribe(function () { return _this._init(); });
1676 };
1677 MatYearView.prototype.ngOnDestroy = function () {
1678 this._rerenderSubscription.unsubscribe();
1679 };
1680 /** Handles when a new month is selected. */
1681 MatYearView.prototype._monthSelected = function (event) {
1682 var month = event.value;
1683 var normalizedDate = this._dateAdapter.createDate(this._dateAdapter.getYear(this.activeDate), month, 1);
1684 this.monthSelected.emit(normalizedDate);
1685 var daysInMonth = this._dateAdapter.getNumDaysInMonth(normalizedDate);
1686 this.selectedChange.emit(this._dateAdapter.createDate(this._dateAdapter.getYear(this.activeDate), month, Math.min(this._dateAdapter.getDate(this.activeDate), daysInMonth)));
1687 };
1688 /** Handles keydown events on the calendar body when calendar is in year view. */
1689 MatYearView.prototype._handleCalendarBodyKeydown = function (event) {
1690 // TODO(mmalerba): We currently allow keyboard navigation to disabled dates, but just prevent
1691 // disabled ones from being selected. This may not be ideal, we should look into whether
1692 // navigation should skip over disabled dates, and if so, how to implement that efficiently.
1693 var oldActiveDate = this._activeDate;
1694 var isRtl = this._isRtl();
1695 switch (event.keyCode) {
1696 case keycodes.LEFT_ARROW:
1697 this.activeDate = this._dateAdapter.addCalendarMonths(this._activeDate, isRtl ? 1 : -1);
1698 break;
1699 case keycodes.RIGHT_ARROW:
1700 this.activeDate = this._dateAdapter.addCalendarMonths(this._activeDate, isRtl ? -1 : 1);
1701 break;
1702 case keycodes.UP_ARROW:
1703 this.activeDate = this._dateAdapter.addCalendarMonths(this._activeDate, -4);
1704 break;
1705 case keycodes.DOWN_ARROW:
1706 this.activeDate = this._dateAdapter.addCalendarMonths(this._activeDate, 4);
1707 break;
1708 case keycodes.HOME:
1709 this.activeDate = this._dateAdapter.addCalendarMonths(this._activeDate, -this._dateAdapter.getMonth(this._activeDate));
1710 break;
1711 case keycodes.END:
1712 this.activeDate = this._dateAdapter.addCalendarMonths(this._activeDate, 11 - this._dateAdapter.getMonth(this._activeDate));
1713 break;
1714 case keycodes.PAGE_UP:
1715 this.activeDate =
1716 this._dateAdapter.addCalendarYears(this._activeDate, event.altKey ? -10 : -1);
1717 break;
1718 case keycodes.PAGE_DOWN:
1719 this.activeDate =
1720 this._dateAdapter.addCalendarYears(this._activeDate, event.altKey ? 10 : 1);
1721 break;
1722 case keycodes.ENTER:
1723 case keycodes.SPACE:
1724 // Note that we only prevent the default action here while the selection happens in
1725 // `keyup` below. We can't do the selection here, because it can cause the calendar to
1726 // reopen if focus is restored immediately. We also can't call `preventDefault` on `keyup`
1727 // because it's too late (see #23305).
1728 this._selectionKeyPressed = true;
1729 break;
1730 default:
1731 // Don't prevent default or focus active cell on keys that we don't explicitly handle.
1732 return;
1733 }
1734 if (this._dateAdapter.compareDate(oldActiveDate, this.activeDate)) {
1735 this.activeDateChange.emit(this.activeDate);
1736 }
1737 this._focusActiveCell();
1738 // Prevent unexpected default actions such as form submission.
1739 event.preventDefault();
1740 };
1741 /** Handles keyup events on the calendar body when calendar is in year view. */
1742 MatYearView.prototype._handleCalendarBodyKeyup = function (event) {
1743 if (event.keyCode === keycodes.SPACE || event.keyCode === keycodes.ENTER) {
1744 if (this._selectionKeyPressed) {
1745 this._monthSelected({ value: this._dateAdapter.getMonth(this._activeDate), event: event });
1746 }
1747 this._selectionKeyPressed = false;
1748 }
1749 };
1750 /** Initializes this year view. */
1751 MatYearView.prototype._init = function () {
1752 var _this = this;
1753 this._setSelectedMonth(this.selected);
1754 this._todayMonth = this._getMonthInCurrentYear(this._dateAdapter.today());
1755 this._yearLabel = this._dateAdapter.getYearName(this.activeDate);
1756 var monthNames = this._dateAdapter.getMonthNames('short');
1757 // First row of months only contains 5 elements so we can fit the year label on the same row.
1758 this._months = [[0, 1, 2, 3], [4, 5, 6, 7], [8, 9, 10, 11]].map(function (row) { return row.map(function (month) { return _this._createCellForMonth(month, monthNames[month]); }); });
1759 this._changeDetectorRef.markForCheck();
1760 };
1761 /** Focuses the active cell after the microtask queue is empty. */
1762 MatYearView.prototype._focusActiveCell = function () {
1763 this._matCalendarBody._focusActiveCell();
1764 };
1765 /**
1766 * Gets the month in this year that the given Date falls on.
1767 * Returns null if the given Date is in another year.
1768 */
1769 MatYearView.prototype._getMonthInCurrentYear = function (date) {
1770 return date && this._dateAdapter.getYear(date) == this._dateAdapter.getYear(this.activeDate) ?
1771 this._dateAdapter.getMonth(date) : null;
1772 };
1773 /** Creates an MatCalendarCell for the given month. */
1774 MatYearView.prototype._createCellForMonth = function (month, monthName) {
1775 var date = this._dateAdapter.createDate(this._dateAdapter.getYear(this.activeDate), month, 1);
1776 var ariaLabel = this._dateAdapter.format(date, this._dateFormats.display.monthYearA11yLabel);
1777 var cellClasses = this.dateClass ? this.dateClass(date, 'year') : undefined;
1778 return new MatCalendarCell(month, monthName.toLocaleUpperCase(), ariaLabel, this._shouldEnableMonth(month), cellClasses);
1779 };
1780 /** Whether the given month is enabled. */
1781 MatYearView.prototype._shouldEnableMonth = function (month) {
1782 var activeYear = this._dateAdapter.getYear(this.activeDate);
1783 if (month === undefined || month === null ||
1784 this._isYearAndMonthAfterMaxDate(activeYear, month) ||
1785 this._isYearAndMonthBeforeMinDate(activeYear, month)) {
1786 return false;
1787 }
1788 if (!this.dateFilter) {
1789 return true;
1790 }
1791 var firstOfMonth = this._dateAdapter.createDate(activeYear, month, 1);
1792 // If any date in the month is enabled count the month as enabled.
1793 for (var date = firstOfMonth; this._dateAdapter.getMonth(date) == month; date = this._dateAdapter.addCalendarDays(date, 1)) {
1794 if (this.dateFilter(date)) {
1795 return true;
1796 }
1797 }
1798 return false;
1799 };
1800 /**
1801 * Tests whether the combination month/year is after this.maxDate, considering
1802 * just the month and year of this.maxDate
1803 */
1804 MatYearView.prototype._isYearAndMonthAfterMaxDate = function (year, month) {
1805 if (this.maxDate) {
1806 var maxYear = this._dateAdapter.getYear(this.maxDate);
1807 var maxMonth = this._dateAdapter.getMonth(this.maxDate);
1808 return year > maxYear || (year === maxYear && month > maxMonth);
1809 }
1810 return false;
1811 };
1812 /**
1813 * Tests whether the combination month/year is before this.minDate, considering
1814 * just the month and year of this.minDate
1815 */
1816 MatYearView.prototype._isYearAndMonthBeforeMinDate = function (year, month) {
1817 if (this.minDate) {
1818 var minYear = this._dateAdapter.getYear(this.minDate);
1819 var minMonth = this._dateAdapter.getMonth(this.minDate);
1820 return year < minYear || (year === minYear && month < minMonth);
1821 }
1822 return false;
1823 };
1824 /** Determines whether the user has the RTL layout direction. */
1825 MatYearView.prototype._isRtl = function () {
1826 return this._dir && this._dir.value === 'rtl';
1827 };
1828 /** Sets the currently-selected month based on a model value. */
1829 MatYearView.prototype._setSelectedMonth = function (value) {
1830 if (value instanceof DateRange) {
1831 this._selectedMonth = this._getMonthInCurrentYear(value.start) ||
1832 this._getMonthInCurrentYear(value.end);
1833 }
1834 else {
1835 this._selectedMonth = this._getMonthInCurrentYear(value);
1836 }
1837 };
1838 return MatYearView;
1839 }());
1840 MatYearView.decorators = [
1841 { type: i0.Component, args: [{
1842 selector: 'mat-year-view',
1843 template: "<table class=\"mat-calendar-table\" role=\"grid\">\n <thead aria-hidden=\"true\" class=\"mat-calendar-table-header\">\n <tr><th class=\"mat-calendar-table-header-divider\" colspan=\"4\"></th></tr>\n </thead>\n <tbody mat-calendar-body\n [label]=\"_yearLabel\"\n [rows]=\"_months\"\n [todayValue]=\"_todayMonth!\"\n [startValue]=\"_selectedMonth!\"\n [endValue]=\"_selectedMonth!\"\n [labelMinRequiredCells]=\"2\"\n [numCols]=\"4\"\n [cellAspectRatio]=\"4 / 7\"\n [activeCell]=\"_dateAdapter.getMonth(activeDate)\"\n (selectedValueChange)=\"_monthSelected($event)\"\n (keyup)=\"_handleCalendarBodyKeyup($event)\"\n (keydown)=\"_handleCalendarBodyKeydown($event)\">\n </tbody>\n</table>\n",
1844 exportAs: 'matYearView',
1845 encapsulation: i0.ViewEncapsulation.None,
1846 changeDetection: i0.ChangeDetectionStrategy.OnPush
1847 },] }
1848 ];
1849 MatYearView.ctorParameters = function () { return [
1850 { type: i0.ChangeDetectorRef },
1851 { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [core.MAT_DATE_FORMATS,] }] },
1852 { type: core.DateAdapter, decorators: [{ type: i0.Optional }] },
1853 { type: bidi.Directionality, decorators: [{ type: i0.Optional }] }
1854 ]; };
1855 MatYearView.propDecorators = {
1856 activeDate: [{ type: i0.Input }],
1857 selected: [{ type: i0.Input }],
1858 minDate: [{ type: i0.Input }],
1859 maxDate: [{ type: i0.Input }],
1860 dateFilter: [{ type: i0.Input }],
1861 dateClass: [{ type: i0.Input }],
1862 selectedChange: [{ type: i0.Output }],
1863 monthSelected: [{ type: i0.Output }],
1864 activeDateChange: [{ type: i0.Output }],
1865 _matCalendarBody: [{ type: i0.ViewChild, args: [MatCalendarBody,] }]
1866 };
1867
1868 /**
1869 * @license
1870 * Copyright Google LLC All Rights Reserved.
1871 *
1872 * Use of this source code is governed by an MIT-style license that can be
1873 * found in the LICENSE file at https://angular.io/license
1874 */
1875 /** Counter used to generate unique IDs. */
1876 var uniqueId = 0;
1877 /** Default header for MatCalendar */
1878 var MatCalendarHeader = /** @class */ (function () {
1879 function MatCalendarHeader(_intl, calendar, _dateAdapter, _dateFormats, changeDetectorRef) {
1880 this._intl = _intl;
1881 this.calendar = calendar;
1882 this._dateAdapter = _dateAdapter;
1883 this._dateFormats = _dateFormats;
1884 this._buttonDescriptionId = "mat-calendar-button-" + uniqueId++;
1885 this.calendar.stateChanges.subscribe(function () { return changeDetectorRef.markForCheck(); });
1886 }
1887 Object.defineProperty(MatCalendarHeader.prototype, "periodButtonText", {
1888 /** The label for the current calendar view. */
1889 get: function () {
1890 if (this.calendar.currentView == 'month') {
1891 return this._dateAdapter
1892 .format(this.calendar.activeDate, this._dateFormats.display.monthYearLabel)
1893 .toLocaleUpperCase();
1894 }
1895 if (this.calendar.currentView == 'year') {
1896 return this._dateAdapter.getYearName(this.calendar.activeDate);
1897 }
1898 // The offset from the active year to the "slot" for the starting year is the
1899 // *actual* first rendered year in the multi-year view, and the last year is
1900 // just yearsPerPage - 1 away.
1901 var activeYear = this._dateAdapter.getYear(this.calendar.activeDate);
1902 var minYearOfPage = activeYear - getActiveOffset(this._dateAdapter, this.calendar.activeDate, this.calendar.minDate, this.calendar.maxDate);
1903 var maxYearOfPage = minYearOfPage + yearsPerPage - 1;
1904 var minYearName = this._dateAdapter.getYearName(this._dateAdapter.createDate(minYearOfPage, 0, 1));
1905 var maxYearName = this._dateAdapter.getYearName(this._dateAdapter.createDate(maxYearOfPage, 0, 1));
1906 return this._intl.formatYearRange(minYearName, maxYearName);
1907 },
1908 enumerable: false,
1909 configurable: true
1910 });
1911 Object.defineProperty(MatCalendarHeader.prototype, "periodButtonLabel", {
1912 get: function () {
1913 return this.calendar.currentView == 'month' ?
1914 this._intl.switchToMultiYearViewLabel : this._intl.switchToMonthViewLabel;
1915 },
1916 enumerable: false,
1917 configurable: true
1918 });
1919 Object.defineProperty(MatCalendarHeader.prototype, "prevButtonLabel", {
1920 /** The label for the previous button. */
1921 get: function () {
1922 return {
1923 'month': this._intl.prevMonthLabel,
1924 'year': this._intl.prevYearLabel,
1925 'multi-year': this._intl.prevMultiYearLabel
1926 }[this.calendar.currentView];
1927 },
1928 enumerable: false,
1929 configurable: true
1930 });
1931 Object.defineProperty(MatCalendarHeader.prototype, "nextButtonLabel", {
1932 /** The label for the next button. */
1933 get: function () {
1934 return {
1935 'month': this._intl.nextMonthLabel,
1936 'year': this._intl.nextYearLabel,
1937 'multi-year': this._intl.nextMultiYearLabel
1938 }[this.calendar.currentView];
1939 },
1940 enumerable: false,
1941 configurable: true
1942 });
1943 /** Handles user clicks on the period label. */
1944 MatCalendarHeader.prototype.currentPeriodClicked = function () {
1945 this.calendar.currentView = this.calendar.currentView == 'month' ? 'multi-year' : 'month';
1946 };
1947 /** Handles user clicks on the previous button. */
1948 MatCalendarHeader.prototype.previousClicked = function () {
1949 this.calendar.activeDate = this.calendar.currentView == 'month' ?
1950 this._dateAdapter.addCalendarMonths(this.calendar.activeDate, -1) :
1951 this._dateAdapter.addCalendarYears(this.calendar.activeDate, this.calendar.currentView == 'year' ? -1 : -yearsPerPage);
1952 };
1953 /** Handles user clicks on the next button. */
1954 MatCalendarHeader.prototype.nextClicked = function () {
1955 this.calendar.activeDate = this.calendar.currentView == 'month' ?
1956 this._dateAdapter.addCalendarMonths(this.calendar.activeDate, 1) :
1957 this._dateAdapter.addCalendarYears(this.calendar.activeDate, this.calendar.currentView == 'year' ? 1 : yearsPerPage);
1958 };
1959 /** Whether the previous period button is enabled. */
1960 MatCalendarHeader.prototype.previousEnabled = function () {
1961 if (!this.calendar.minDate) {
1962 return true;
1963 }
1964 return !this.calendar.minDate ||
1965 !this._isSameView(this.calendar.activeDate, this.calendar.minDate);
1966 };
1967 /** Whether the next period button is enabled. */
1968 MatCalendarHeader.prototype.nextEnabled = function () {
1969 return !this.calendar.maxDate ||
1970 !this._isSameView(this.calendar.activeDate, this.calendar.maxDate);
1971 };
1972 /** Whether the two dates represent the same view in the current view mode (month or year). */
1973 MatCalendarHeader.prototype._isSameView = function (date1, date2) {
1974 if (this.calendar.currentView == 'month') {
1975 return this._dateAdapter.getYear(date1) == this._dateAdapter.getYear(date2) &&
1976 this._dateAdapter.getMonth(date1) == this._dateAdapter.getMonth(date2);
1977 }
1978 if (this.calendar.currentView == 'year') {
1979 return this._dateAdapter.getYear(date1) == this._dateAdapter.getYear(date2);
1980 }
1981 // Otherwise we are in 'multi-year' view.
1982 return isSameMultiYearView(this._dateAdapter, date1, date2, this.calendar.minDate, this.calendar.maxDate);
1983 };
1984 return MatCalendarHeader;
1985 }());
1986 MatCalendarHeader.decorators = [
1987 { type: i0.Component, args: [{
1988 selector: 'mat-calendar-header',
1989 template: "<div class=\"mat-calendar-header\">\n <div class=\"mat-calendar-controls\">\n <button mat-button type=\"button\" class=\"mat-calendar-period-button\"\n (click)=\"currentPeriodClicked()\" [attr.aria-label]=\"periodButtonLabel\"\n [attr.aria-describedby]=\"_buttonDescriptionId\"\n cdkAriaLive=\"polite\">\n <span [attr.id]=\"_buttonDescriptionId\">{{periodButtonText}}</span>\n <div class=\"mat-calendar-arrow\"\n [class.mat-calendar-invert]=\"calendar.currentView !== 'month'\"></div>\n </button>\n\n <div class=\"mat-calendar-spacer\"></div>\n\n <ng-content></ng-content>\n\n <button mat-icon-button type=\"button\" class=\"mat-calendar-previous-button\"\n [disabled]=\"!previousEnabled()\" (click)=\"previousClicked()\"\n [attr.aria-label]=\"prevButtonLabel\">\n </button>\n\n <button mat-icon-button type=\"button\" class=\"mat-calendar-next-button\"\n [disabled]=\"!nextEnabled()\" (click)=\"nextClicked()\"\n [attr.aria-label]=\"nextButtonLabel\">\n </button>\n </div>\n</div>\n",
1990 exportAs: 'matCalendarHeader',
1991 encapsulation: i0.ViewEncapsulation.None,
1992 changeDetection: i0.ChangeDetectionStrategy.OnPush
1993 },] }
1994 ];
1995 MatCalendarHeader.ctorParameters = function () { return [
1996 { type: MatDatepickerIntl },
1997 { type: MatCalendar, decorators: [{ type: i0.Inject, args: [i0.forwardRef(function () { return MatCalendar; }),] }] },
1998 { type: core.DateAdapter, decorators: [{ type: i0.Optional }] },
1999 { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [core.MAT_DATE_FORMATS,] }] },
2000 { type: i0.ChangeDetectorRef }
2001 ]; };
2002 /** A calendar that is used as part of the datepicker. */
2003 var MatCalendar = /** @class */ (function () {
2004 function MatCalendar(_intl, _dateAdapter, _dateFormats, _changeDetectorRef) {
2005 var _this = this;
2006 this._dateAdapter = _dateAdapter;
2007 this._dateFormats = _dateFormats;
2008 this._changeDetectorRef = _changeDetectorRef;
2009 /**
2010 * Used for scheduling that focus should be moved to the active cell on the next tick.
2011 * We need to schedule it, rather than do it immediately, because we have to wait
2012 * for Angular to re-evaluate the view children.
2013 */
2014 this._moveFocusOnNextTick = false;
2015 /** Whether the calendar should be started in month or year view. */
2016 this.startView = 'month';
2017 /** Emits when the currently selected date changes. */
2018 this.selectedChange = new i0.EventEmitter();
2019 /**
2020 * Emits the year chosen in multiyear view.
2021 * This doesn't imply a change on the selected date.
2022 */
2023 this.yearSelected = new i0.EventEmitter();
2024 /**
2025 * Emits the month chosen in year view.
2026 * This doesn't imply a change on the selected date.
2027 */
2028 this.monthSelected = new i0.EventEmitter();
2029 /**
2030 * Emits when the current view changes.
2031 */
2032 this.viewChanged = new i0.EventEmitter(true);
2033 /** Emits when any date is selected. */
2034 this._userSelection = new i0.EventEmitter();
2035 /**
2036 * Emits whenever there is a state change that the header may need to respond to.
2037 */
2038 this.stateChanges = new rxjs.Subject();
2039 if (typeof ngDevMode === 'undefined' || ngDevMode) {
2040 if (!this._dateAdapter) {
2041 throw createMissingDateImplError('DateAdapter');
2042 }
2043 if (!this._dateFormats) {
2044 throw createMissingDateImplError('MAT_DATE_FORMATS');
2045 }
2046 }
2047 this._intlChanges = _intl.changes.subscribe(function () {
2048 _changeDetectorRef.markForCheck();
2049 _this.stateChanges.next();
2050 });
2051 }
2052 Object.defineProperty(MatCalendar.prototype, "startAt", {
2053 /** A date representing the period (month or year) to start the calendar in. */
2054 get: function () { return this._startAt; },
2055 set: function (value) {
2056 this._startAt = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
2057 },
2058 enumerable: false,
2059 configurable: true
2060 });
2061 Object.defineProperty(MatCalendar.prototype, "selected", {
2062 /** The currently selected date. */
2063 get: function () { return this._selected; },
2064 set: function (value) {
2065 if (value instanceof DateRange) {
2066 this._selected = value;
2067 }
2068 else {
2069 this._selected = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
2070 }
2071 },
2072 enumerable: false,
2073 configurable: true
2074 });
2075 Object.defineProperty(MatCalendar.prototype, "minDate", {
2076 /** The minimum selectable date. */
2077 get: function () { return this._minDate; },
2078 set: function (value) {
2079 this._minDate = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
2080 },
2081 enumerable: false,
2082 configurable: true
2083 });
2084 Object.defineProperty(MatCalendar.prototype, "maxDate", {
2085 /** The maximum selectable date. */
2086 get: function () { return this._maxDate; },
2087 set: function (value) {
2088 this._maxDate = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
2089 },
2090 enumerable: false,
2091 configurable: true
2092 });
2093 Object.defineProperty(MatCalendar.prototype, "activeDate", {
2094 /**
2095 * The current active date. This determines which time period is shown and which date is
2096 * highlighted when using keyboard navigation.
2097 */
2098 get: function () { return this._clampedActiveDate; },
2099 set: function (value) {
2100 this._clampedActiveDate = this._dateAdapter.clampDate(value, this.minDate, this.maxDate);
2101 this.stateChanges.next();
2102 this._changeDetectorRef.markForCheck();
2103 },
2104 enumerable: false,
2105 configurable: true
2106 });
2107 Object.defineProperty(MatCalendar.prototype, "currentView", {
2108 /** Whether the calendar is in month view. */
2109 get: function () { return this._currentView; },
2110 set: function (value) {
2111 var viewChangedResult = this._currentView !== value ? value : null;
2112 this._currentView = value;
2113 this._moveFocusOnNextTick = true;
2114 this._changeDetectorRef.markForCheck();
2115 if (viewChangedResult) {
2116 this.viewChanged.emit(viewChangedResult);
2117 }
2118 },
2119 enumerable: false,
2120 configurable: true
2121 });
2122 MatCalendar.prototype.ngAfterContentInit = function () {
2123 this._calendarHeaderPortal = new portal.ComponentPortal(this.headerComponent || MatCalendarHeader);
2124 this.activeDate = this.startAt || this._dateAdapter.today();
2125 // Assign to the private property since we don't want to move focus on init.
2126 this._currentView = this.startView;
2127 };
2128 MatCalendar.prototype.ngAfterViewChecked = function () {
2129 if (this._moveFocusOnNextTick) {
2130 this._moveFocusOnNextTick = false;
2131 this.focusActiveCell();
2132 }
2133 };
2134 MatCalendar.prototype.ngOnDestroy = function () {
2135 this._intlChanges.unsubscribe();
2136 this.stateChanges.complete();
2137 };
2138 MatCalendar.prototype.ngOnChanges = function (changes) {
2139 var change = changes['minDate'] || changes['maxDate'] || changes['dateFilter'];
2140 if (change && !change.firstChange) {
2141 var view = this._getCurrentViewComponent();
2142 if (view) {
2143 // We need to `detectChanges` manually here, because the `minDate`, `maxDate` etc. are
2144 // passed down to the view via data bindings which won't be up-to-date when we call `_init`.
2145 this._changeDetectorRef.detectChanges();
2146 view._init();
2147 }
2148 }
2149 this.stateChanges.next();
2150 };
2151 /** Focuses the active date. */
2152 MatCalendar.prototype.focusActiveCell = function () {
2153 this._getCurrentViewComponent()._focusActiveCell(false);
2154 };
2155 /** Updates today's date after an update of the active date */
2156 MatCalendar.prototype.updateTodaysDate = function () {
2157 this._getCurrentViewComponent()._init();
2158 };
2159 /** Handles date selection in the month view. */
2160 MatCalendar.prototype._dateSelected = function (event) {
2161 var date = event.value;
2162 if (this.selected instanceof DateRange ||
2163 (date && !this._dateAdapter.sameDate(date, this.selected))) {
2164 this.selectedChange.emit(date);
2165 }
2166 this._userSelection.emit(event);
2167 };
2168 /** Handles year selection in the multiyear view. */
2169 MatCalendar.prototype._yearSelectedInMultiYearView = function (normalizedYear) {
2170 this.yearSelected.emit(normalizedYear);
2171 };
2172 /** Handles month selection in the year view. */
2173 MatCalendar.prototype._monthSelectedInYearView = function (normalizedMonth) {
2174 this.monthSelected.emit(normalizedMonth);
2175 };
2176 /** Handles year/month selection in the multi-year/year views. */
2177 MatCalendar.prototype._goToDateInView = function (date, view) {
2178 this.activeDate = date;
2179 this.currentView = view;
2180 };
2181 /** Returns the component instance that corresponds to the current calendar view. */
2182 MatCalendar.prototype._getCurrentViewComponent = function () {
2183 // The return type is explicitly written as a union to ensure that the Closure compiler does
2184 // not optimize calls to _init(). Without the explict return type, TypeScript narrows it to
2185 // only the first component type. See https://github.com/angular/components/issues/22996.
2186 return this.monthView || this.yearView || this.multiYearView;
2187 };
2188 return MatCalendar;
2189 }());
2190 MatCalendar.decorators = [
2191 { type: i0.Component, args: [{
2192 selector: 'mat-calendar',
2193 template: "<ng-template [cdkPortalOutlet]=\"_calendarHeaderPortal\"></ng-template>\n\n<div class=\"mat-calendar-content\" [ngSwitch]=\"currentView\" cdkMonitorSubtreeFocus tabindex=\"-1\">\n <mat-month-view\n *ngSwitchCase=\"'month'\"\n [(activeDate)]=\"activeDate\"\n [selected]=\"selected\"\n [dateFilter]=\"dateFilter\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [dateClass]=\"dateClass\"\n [comparisonStart]=\"comparisonStart\"\n [comparisonEnd]=\"comparisonEnd\"\n (_userSelection)=\"_dateSelected($event)\">\n </mat-month-view>\n\n <mat-year-view\n *ngSwitchCase=\"'year'\"\n [(activeDate)]=\"activeDate\"\n [selected]=\"selected\"\n [dateFilter]=\"dateFilter\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [dateClass]=\"dateClass\"\n (monthSelected)=\"_monthSelectedInYearView($event)\"\n (selectedChange)=\"_goToDateInView($event, 'month')\">\n </mat-year-view>\n\n <mat-multi-year-view\n *ngSwitchCase=\"'multi-year'\"\n [(activeDate)]=\"activeDate\"\n [selected]=\"selected\"\n [dateFilter]=\"dateFilter\"\n [maxDate]=\"maxDate\"\n [minDate]=\"minDate\"\n [dateClass]=\"dateClass\"\n (yearSelected)=\"_yearSelectedInMultiYearView($event)\"\n (selectedChange)=\"_goToDateInView($event, 'year')\">\n </mat-multi-year-view>\n</div>\n",
2194 host: {
2195 'class': 'mat-calendar',
2196 },
2197 exportAs: 'matCalendar',
2198 encapsulation: i0.ViewEncapsulation.None,
2199 changeDetection: i0.ChangeDetectionStrategy.OnPush,
2200 providers: [MAT_SINGLE_DATE_SELECTION_MODEL_PROVIDER],
2201 styles: [".mat-calendar{display:block}.mat-calendar-header{padding:8px 8px 0 8px}.mat-calendar-content{padding:0 8px 8px 8px;outline:none}.mat-calendar-controls{display:flex;margin:5% calc(33% / 7 - 16px)}.mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:.04}.mat-calendar-spacer{flex:1 1 auto}.mat-calendar-period-button{min-width:0}.mat-calendar-arrow{display:inline-block;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top-width:5px;border-top-style:solid;margin:0 0 0 5px;vertical-align:middle}.mat-calendar-arrow.mat-calendar-invert{transform:rotate(180deg)}[dir=rtl] .mat-calendar-arrow{margin:0 5px 0 0}.mat-calendar-previous-button,.mat-calendar-next-button{position:relative}.mat-calendar-previous-button::after,.mat-calendar-next-button::after{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";margin:15.5px;border:0 solid currentColor;border-top-width:2px}[dir=rtl] .mat-calendar-previous-button,[dir=rtl] .mat-calendar-next-button{transform:rotate(180deg)}.mat-calendar-previous-button::after{border-left-width:2px;transform:translateX(2px) rotate(-45deg)}.mat-calendar-next-button::after{border-right-width:2px;transform:translateX(-2px) rotate(45deg)}.mat-calendar-table{border-spacing:0;border-collapse:collapse;width:100%}.mat-calendar-table-header th{text-align:center;padding:0 0 8px 0}.mat-calendar-table-header-divider{position:relative;height:1px}.mat-calendar-table-header-divider::after{content:\"\";position:absolute;top:0;left:-8px;right:-8px;height:1px}.mat-calendar-abbr{text-decoration:none}\n"]
2202 },] }
2203 ];
2204 MatCalendar.ctorParameters = function () { return [
2205 { type: MatDatepickerIntl },
2206 { type: core.DateAdapter, decorators: [{ type: i0.Optional }] },
2207 { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [core.MAT_DATE_FORMATS,] }] },
2208 { type: i0.ChangeDetectorRef }
2209 ]; };
2210 MatCalendar.propDecorators = {
2211 headerComponent: [{ type: i0.Input }],
2212 startAt: [{ type: i0.Input }],
2213 startView: [{ type: i0.Input }],
2214 selected: [{ type: i0.Input }],
2215 minDate: [{ type: i0.Input }],
2216 maxDate: [{ type: i0.Input }],
2217 dateFilter: [{ type: i0.Input }],
2218 dateClass: [{ type: i0.Input }],
2219 comparisonStart: [{ type: i0.Input }],
2220 comparisonEnd: [{ type: i0.Input }],
2221 selectedChange: [{ type: i0.Output }],
2222 yearSelected: [{ type: i0.Output }],
2223 monthSelected: [{ type: i0.Output }],
2224 viewChanged: [{ type: i0.Output }],
2225 _userSelection: [{ type: i0.Output }],
2226 monthView: [{ type: i0.ViewChild, args: [MatMonthView,] }],
2227 yearView: [{ type: i0.ViewChild, args: [MatYearView,] }],
2228 multiYearView: [{ type: i0.ViewChild, args: [MatMultiYearView,] }]
2229 };
2230
2231 /**
2232 * @license
2233 * Copyright Google LLC All Rights Reserved.
2234 *
2235 * Use of this source code is governed by an MIT-style license that can be
2236 * found in the LICENSE file at https://angular.io/license
2237 */
2238 /**
2239 * Animations used by the Material datepicker.
2240 * @docs-private
2241 */
2242 var matDatepickerAnimations = {
2243 /** Transforms the height of the datepicker's calendar. */
2244 transformPanel: animations.trigger('transformPanel', [
2245 animations.transition('void => enter-dropdown', animations.animate('120ms cubic-bezier(0, 0, 0.2, 1)', animations.keyframes([
2246 animations.style({ opacity: 0, transform: 'scale(1, 0.8)' }),
2247 animations.style({ opacity: 1, transform: 'scale(1, 1)' })
2248 ]))),
2249 animations.transition('void => enter-dialog', animations.animate('150ms cubic-bezier(0, 0, 0.2, 1)', animations.keyframes([
2250 animations.style({ opacity: 0, transform: 'scale(0.7)' }),
2251 animations.style({ transform: 'none', opacity: 1 })
2252 ]))),
2253 animations.transition('* => void', animations.animate('100ms linear', animations.style({ opacity: 0 })))
2254 ]),
2255 /** Fades in the content of the calendar. */
2256 fadeInCalendar: animations.trigger('fadeInCalendar', [
2257 animations.state('void', animations.style({ opacity: 0 })),
2258 animations.state('enter', animations.style({ opacity: 1 })),
2259 // TODO(crisbeto): this animation should be removed since it isn't quite on spec, but we
2260 // need to keep it until #12440 gets in, otherwise the exit animation will look glitchy.
2261 animations.transition('void => *', animations.animate('120ms 100ms cubic-bezier(0.55, 0, 0.55, 0.2)'))
2262 ])
2263 };
2264
2265 /** Used to generate a unique ID for each datepicker instance. */
2266 var datepickerUid = 0;
2267 /** Injection token that determines the scroll handling while the calendar is open. */
2268 var MAT_DATEPICKER_SCROLL_STRATEGY = new i0.InjectionToken('mat-datepicker-scroll-strategy');
2269 /** @docs-private */
2270 function MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY(overlay) {
2271 return function () { return overlay.scrollStrategies.reposition(); };
2272 }
2273 /** @docs-private */
2274 var MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER = {
2275 provide: MAT_DATEPICKER_SCROLL_STRATEGY,
2276 deps: [overlay.Overlay],
2277 useFactory: MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY,
2278 };
2279 // Boilerplate for applying mixins to MatDatepickerContent.
2280 /** @docs-private */
2281 var _MatDatepickerContentBase = core.mixinColor(/** @class */ (function () {
2282 function class_1(_elementRef) {
2283 this._elementRef = _elementRef;
2284 }
2285 return class_1;
2286 }()));
2287 /**
2288 * Component used as the content for the datepicker overlay. We use this instead of using
2289 * MatCalendar directly as the content so we can control the initial focus. This also gives us a
2290 * place to put additional features of the overlay that are not part of the calendar itself in the
2291 * future. (e.g. confirmation buttons).
2292 * @docs-private
2293 */
2294 var MatDatepickerContent = /** @class */ (function (_super) {
2295 __extends(MatDatepickerContent, _super);
2296 function MatDatepickerContent(elementRef, _changeDetectorRef, _globalModel, _dateAdapter, _rangeSelectionStrategy, intl) {
2297 var _this = _super.call(this, elementRef) || this;
2298 _this._changeDetectorRef = _changeDetectorRef;
2299 _this._globalModel = _globalModel;
2300 _this._dateAdapter = _dateAdapter;
2301 _this._rangeSelectionStrategy = _rangeSelectionStrategy;
2302 _this._subscriptions = new rxjs.Subscription();
2303 /** Emits when an animation has finished. */
2304 _this._animationDone = new rxjs.Subject();
2305 /** Portal with projected action buttons. */
2306 _this._actionsPortal = null;
2307 _this._closeButtonText = intl.closeCalendarLabel;
2308 return _this;
2309 }
2310 MatDatepickerContent.prototype.ngOnInit = function () {
2311 // If we have actions, clone the model so that we have the ability to cancel the selection,
2312 // otherwise update the global model directly. Note that we want to assign this as soon as
2313 // possible, but `_actionsPortal` isn't available in the constructor so we do it in `ngOnInit`.
2314 this._model = this._actionsPortal ? this._globalModel.clone() : this._globalModel;
2315 this._animationState = this.datepicker.touchUi ? 'enter-dialog' : 'enter-dropdown';
2316 };
2317 MatDatepickerContent.prototype.ngAfterViewInit = function () {
2318 var _this = this;
2319 this._subscriptions.add(this.datepicker.stateChanges.subscribe(function () {
2320 _this._changeDetectorRef.markForCheck();
2321 }));
2322 this._calendar.focusActiveCell();
2323 };
2324 MatDatepickerContent.prototype.ngOnDestroy = function () {
2325 this._subscriptions.unsubscribe();
2326 this._animationDone.complete();
2327 };
2328 MatDatepickerContent.prototype._handleUserSelection = function (event) {
2329 var selection = this._model.selection;
2330 var value = event.value;
2331 var isRange = selection instanceof DateRange;
2332 // If we're selecting a range and we have a selection strategy, always pass the value through
2333 // there. Otherwise don't assign null values to the model, unless we're selecting a range.
2334 // A null value when picking a range means that the user cancelled the selection (e.g. by
2335 // pressing escape), whereas when selecting a single value it means that the value didn't
2336 // change. This isn't very intuitive, but it's here for backwards-compatibility.
2337 if (isRange && this._rangeSelectionStrategy) {
2338 var newSelection = this._rangeSelectionStrategy.selectionFinished(value, selection, event.event);
2339 this._model.updateSelection(newSelection, this);
2340 }
2341 else if (value && (isRange ||
2342 !this._dateAdapter.sameDate(value, selection))) {
2343 this._model.add(value);
2344 }
2345 // Delegate closing the overlay to the actions.
2346 if ((!this._model || this._model.isComplete()) && !this._actionsPortal) {
2347 this.datepicker.close();
2348 }
2349 };
2350 MatDatepickerContent.prototype._startExitAnimation = function () {
2351 this._animationState = 'void';
2352 this._changeDetectorRef.markForCheck();
2353 };
2354 MatDatepickerContent.prototype._getSelected = function () {
2355 return this._model.selection;
2356 };
2357 /** Applies the current pending selection to the global model. */
2358 MatDatepickerContent.prototype._applyPendingSelection = function () {
2359 if (this._model !== this._globalModel) {
2360 this._globalModel.updateSelection(this._model.selection, this);
2361 }
2362 };
2363 return MatDatepickerContent;
2364 }(_MatDatepickerContentBase));
2365 MatDatepickerContent.decorators = [
2366 { type: i0.Component, args: [{
2367 selector: 'mat-datepicker-content',
2368 template: "<div\n cdkTrapFocus\n class=\"mat-datepicker-content-container\"\n [class.mat-datepicker-content-container-with-actions]=\"_actionsPortal\">\n <mat-calendar\n [id]=\"datepicker.id\"\n [ngClass]=\"datepicker.panelClass\"\n [startAt]=\"datepicker.startAt\"\n [startView]=\"datepicker.startView\"\n [minDate]=\"datepicker._getMinDate()\"\n [maxDate]=\"datepicker._getMaxDate()\"\n [dateFilter]=\"datepicker._getDateFilter()\"\n [headerComponent]=\"datepicker.calendarHeaderComponent\"\n [selected]=\"_getSelected()\"\n [dateClass]=\"datepicker.dateClass\"\n [comparisonStart]=\"comparisonStart\"\n [comparisonEnd]=\"comparisonEnd\"\n [@fadeInCalendar]=\"'enter'\"\n (yearSelected)=\"datepicker._selectYear($event)\"\n (monthSelected)=\"datepicker._selectMonth($event)\"\n (viewChanged)=\"datepicker._viewChanged($event)\"\n (_userSelection)=\"_handleUserSelection($event)\"></mat-calendar>\n\n <ng-template [cdkPortalOutlet]=\"_actionsPortal\"></ng-template>\n\n <!-- Invisible close button for screen reader users. -->\n <button\n type=\"button\"\n mat-raised-button\n [color]=\"color || 'primary'\"\n class=\"mat-datepicker-close-button\"\n [class.cdk-visually-hidden]=\"!_closeButtonFocused\"\n (focus)=\"_closeButtonFocused = true\"\n (blur)=\"_closeButtonFocused = false\"\n (click)=\"datepicker.close()\">{{ _closeButtonText }}</button>\n</div>\n",
2369 host: {
2370 'class': 'mat-datepicker-content',
2371 '[@transformPanel]': '_animationState',
2372 '(@transformPanel.done)': '_animationDone.next()',
2373 '[class.mat-datepicker-content-touch]': 'datepicker.touchUi',
2374 },
2375 animations: [
2376 matDatepickerAnimations.transformPanel,
2377 matDatepickerAnimations.fadeInCalendar,
2378 ],
2379 exportAs: 'matDatepickerContent',
2380 encapsulation: i0.ViewEncapsulation.None,
2381 changeDetection: i0.ChangeDetectionStrategy.OnPush,
2382 inputs: ['color'],
2383 styles: [".mat-datepicker-content{display:block;border-radius:4px}.mat-datepicker-content .mat-calendar{width:296px;height:354px}.mat-datepicker-content .mat-datepicker-close-button{position:absolute;top:100%;left:0;margin-top:8px}.ng-animating .mat-datepicker-content .mat-datepicker-close-button{display:none}.mat-datepicker-content-container{display:flex;flex-direction:column;justify-content:space-between}.mat-datepicker-content-touch{display:block;max-height:80vh;position:relative;overflow:visible}.mat-datepicker-content-touch .mat-datepicker-content-container{min-height:312px;max-height:788px;min-width:250px;max-width:750px}.mat-datepicker-content-touch .mat-calendar{width:100%;height:auto}@media all and (orientation: landscape){.mat-datepicker-content-touch .mat-datepicker-content-container{width:64vh;height:80vh}}@media all and (orientation: portrait){.mat-datepicker-content-touch .mat-datepicker-content-container{width:80vw;height:100vw}.mat-datepicker-content-touch .mat-datepicker-content-container-with-actions{height:115vw}}\n"]
2384 },] }
2385 ];
2386 MatDatepickerContent.ctorParameters = function () { return [
2387 { type: i0.ElementRef },
2388 { type: i0.ChangeDetectorRef },
2389 { type: MatDateSelectionModel },
2390 { type: core.DateAdapter },
2391 { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [MAT_DATE_RANGE_SELECTION_STRATEGY,] }] },
2392 { type: MatDatepickerIntl }
2393 ]; };
2394 MatDatepickerContent.propDecorators = {
2395 _calendar: [{ type: i0.ViewChild, args: [MatCalendar,] }]
2396 };
2397 /** Base class for a datepicker. */
2398 var MatDatepickerBase = /** @class */ (function () {
2399 function MatDatepickerBase(
2400 /**
2401 * @deprecated `_dialog` parameter is no longer being used and it will be removed.
2402 * @breaking-change 13.0.0
2403 */
2404 _dialog, _overlay, _ngZone, _viewContainerRef, scrollStrategy, _dateAdapter, _dir,
2405 /**
2406 * @deprecated No longer being used. To be removed.
2407 * @breaking-change 13.0.0
2408 */
2409 _document, _model) {
2410 this._overlay = _overlay;
2411 this._ngZone = _ngZone;
2412 this._viewContainerRef = _viewContainerRef;
2413 this._dateAdapter = _dateAdapter;
2414 this._dir = _dir;
2415 this._model = _model;
2416 this._inputStateChanges = rxjs.Subscription.EMPTY;
2417 /** The view that the calendar should start in. */
2418 this.startView = 'month';
2419 this._touchUi = false;
2420 /** Preferred position of the datepicker in the X axis. */
2421 this.xPosition = 'start';
2422 /** Preferred position of the datepicker in the Y axis. */
2423 this.yPosition = 'below';
2424 this._restoreFocus = true;
2425 /**
2426 * Emits selected year in multiyear view.
2427 * This doesn't imply a change on the selected date.
2428 */
2429 this.yearSelected = new i0.EventEmitter();
2430 /**
2431 * Emits selected month in year view.
2432 * This doesn't imply a change on the selected date.
2433 */
2434 this.monthSelected = new i0.EventEmitter();
2435 /**
2436 * Emits when the current view changes.
2437 */
2438 this.viewChanged = new i0.EventEmitter(true);
2439 /** Emits when the datepicker has been opened. */
2440 this.openedStream = new i0.EventEmitter();
2441 /** Emits when the datepicker has been closed. */
2442 this.closedStream = new i0.EventEmitter();
2443 this._opened = false;
2444 /** The id for the datepicker calendar. */
2445 this.id = "mat-datepicker-" + datepickerUid++;
2446 /** The element that was focused before the datepicker was opened. */
2447 this._focusedElementBeforeOpen = null;
2448 /** Unique class that will be added to the backdrop so that the test harnesses can look it up. */
2449 this._backdropHarnessClass = this.id + "-backdrop";
2450 /** Emits when the datepicker's state changes. */
2451 this.stateChanges = new rxjs.Subject();
2452 if (!this._dateAdapter && (typeof ngDevMode === 'undefined' || ngDevMode)) {
2453 throw createMissingDateImplError('DateAdapter');
2454 }
2455 this._scrollStrategy = scrollStrategy;
2456 }
2457 Object.defineProperty(MatDatepickerBase.prototype, "startAt", {
2458 /** The date to open the calendar to initially. */
2459 get: function () {
2460 // If an explicit startAt is set we start there, otherwise we start at whatever the currently
2461 // selected value is.
2462 return this._startAt || (this.datepickerInput ? this.datepickerInput.getStartValue() : null);
2463 },
2464 set: function (value) {
2465 this._startAt = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
2466 },
2467 enumerable: false,
2468 configurable: true
2469 });
2470 Object.defineProperty(MatDatepickerBase.prototype, "color", {
2471 /** Color palette to use on the datepicker's calendar. */
2472 get: function () {
2473 return this._color ||
2474 (this.datepickerInput ? this.datepickerInput.getThemePalette() : undefined);
2475 },
2476 set: function (value) {
2477 this._color = value;
2478 },
2479 enumerable: false,
2480 configurable: true
2481 });
2482 Object.defineProperty(MatDatepickerBase.prototype, "touchUi", {
2483 /**
2484 * Whether the calendar UI is in touch mode. In touch mode the calendar opens in a dialog rather
2485 * than a dropdown and elements have more padding to allow for bigger touch targets.
2486 */
2487 get: function () { return this._touchUi; },
2488 set: function (value) {
2489 this._touchUi = coercion.coerceBooleanProperty(value);
2490 },
2491 enumerable: false,
2492 configurable: true
2493 });
2494 Object.defineProperty(MatDatepickerBase.prototype, "disabled", {
2495 /** Whether the datepicker pop-up should be disabled. */
2496 get: function () {
2497 return this._disabled === undefined && this.datepickerInput ?
2498 this.datepickerInput.disabled : !!this._disabled;
2499 },
2500 set: function (value) {
2501 var newValue = coercion.coerceBooleanProperty(value);
2502 if (newValue !== this._disabled) {
2503 this._disabled = newValue;
2504 this.stateChanges.next(undefined);
2505 }
2506 },
2507 enumerable: false,
2508 configurable: true
2509 });
2510 Object.defineProperty(MatDatepickerBase.prototype, "restoreFocus", {
2511 /**
2512 * Whether to restore focus to the previously-focused element when the calendar is closed.
2513 * Note that automatic focus restoration is an accessibility feature and it is recommended that
2514 * you provide your own equivalent, if you decide to turn it off.
2515 */
2516 get: function () { return this._restoreFocus; },
2517 set: function (value) {
2518 this._restoreFocus = coercion.coerceBooleanProperty(value);
2519 },
2520 enumerable: false,
2521 configurable: true
2522 });
2523 Object.defineProperty(MatDatepickerBase.prototype, "panelClass", {
2524 /**
2525 * Classes to be passed to the date picker panel.
2526 * Supports string and string array values, similar to `ngClass`.
2527 */
2528 get: function () { return this._panelClass; },
2529 set: function (value) {
2530 this._panelClass = coercion.coerceStringArray(value);
2531 },
2532 enumerable: false,
2533 configurable: true
2534 });
2535 Object.defineProperty(MatDatepickerBase.prototype, "opened", {
2536 /** Whether the calendar is open. */
2537 get: function () { return this._opened; },
2538 set: function (value) {
2539 coercion.coerceBooleanProperty(value) ? this.open() : this.close();
2540 },
2541 enumerable: false,
2542 configurable: true
2543 });
2544 /** The minimum selectable date. */
2545 MatDatepickerBase.prototype._getMinDate = function () {
2546 return this.datepickerInput && this.datepickerInput.min;
2547 };
2548 /** The maximum selectable date. */
2549 MatDatepickerBase.prototype._getMaxDate = function () {
2550 return this.datepickerInput && this.datepickerInput.max;
2551 };
2552 MatDatepickerBase.prototype._getDateFilter = function () {
2553 return this.datepickerInput && this.datepickerInput.dateFilter;
2554 };
2555 MatDatepickerBase.prototype.ngOnChanges = function (changes) {
2556 var positionChange = changes['xPosition'] || changes['yPosition'];
2557 if (positionChange && !positionChange.firstChange && this._overlayRef) {
2558 var positionStrategy = this._overlayRef.getConfig().positionStrategy;
2559 if (positionStrategy instanceof overlay.FlexibleConnectedPositionStrategy) {
2560 this._setConnectedPositions(positionStrategy);
2561 if (this.opened) {
2562 this._overlayRef.updatePosition();
2563 }
2564 }
2565 }
2566 this.stateChanges.next(undefined);
2567 };
2568 MatDatepickerBase.prototype.ngOnDestroy = function () {
2569 this._destroyOverlay();
2570 this.close();
2571 this._inputStateChanges.unsubscribe();
2572 this.stateChanges.complete();
2573 };
2574 /** Selects the given date */
2575 MatDatepickerBase.prototype.select = function (date) {
2576 this._model.add(date);
2577 };
2578 /** Emits the selected year in multiyear view */
2579 MatDatepickerBase.prototype._selectYear = function (normalizedYear) {
2580 this.yearSelected.emit(normalizedYear);
2581 };
2582 /** Emits selected month in year view */
2583 MatDatepickerBase.prototype._selectMonth = function (normalizedMonth) {
2584 this.monthSelected.emit(normalizedMonth);
2585 };
2586 /** Emits changed view */
2587 MatDatepickerBase.prototype._viewChanged = function (view) {
2588 this.viewChanged.emit(view);
2589 };
2590 /**
2591 * Register an input with this datepicker.
2592 * @param input The datepicker input to register with this datepicker.
2593 * @returns Selection model that the input should hook itself up to.
2594 */
2595 MatDatepickerBase.prototype.registerInput = function (input) {
2596 var _this = this;
2597 if (this.datepickerInput && (typeof ngDevMode === 'undefined' || ngDevMode)) {
2598 throw Error('A MatDatepicker can only be associated with a single input.');
2599 }
2600 this._inputStateChanges.unsubscribe();
2601 this.datepickerInput = input;
2602 this._inputStateChanges =
2603 input.stateChanges.subscribe(function () { return _this.stateChanges.next(undefined); });
2604 return this._model;
2605 };
2606 /**
2607 * Registers a portal containing action buttons with the datepicker.
2608 * @param portal Portal to be registered.
2609 */
2610 MatDatepickerBase.prototype.registerActions = function (portal) {
2611 if (this._actionsPortal && (typeof ngDevMode === 'undefined' || ngDevMode)) {
2612 throw Error('A MatDatepicker can only be associated with a single actions row.');
2613 }
2614 this._actionsPortal = portal;
2615 };
2616 /**
2617 * Removes a portal containing action buttons from the datepicker.
2618 * @param portal Portal to be removed.
2619 */
2620 MatDatepickerBase.prototype.removeActions = function (portal) {
2621 if (portal === this._actionsPortal) {
2622 this._actionsPortal = null;
2623 }
2624 };
2625 /** Open the calendar. */
2626 MatDatepickerBase.prototype.open = function () {
2627 if (this._opened || this.disabled) {
2628 return;
2629 }
2630 if (!this.datepickerInput && (typeof ngDevMode === 'undefined' || ngDevMode)) {
2631 throw Error('Attempted to open an MatDatepicker with no associated input.');
2632 }
2633 this._focusedElementBeforeOpen = platform._getFocusedElementPierceShadowDom();
2634 this._openOverlay();
2635 this._opened = true;
2636 this.openedStream.emit();
2637 };
2638 /** Close the calendar. */
2639 MatDatepickerBase.prototype.close = function () {
2640 var _this = this;
2641 if (!this._opened) {
2642 return;
2643 }
2644 if (this._componentRef) {
2645 var instance = this._componentRef.instance;
2646 instance._startExitAnimation();
2647 instance._animationDone.pipe(operators.take(1)).subscribe(function () { return _this._destroyOverlay(); });
2648 }
2649 var completeClose = function () {
2650 // The `_opened` could've been reset already if
2651 // we got two events in quick succession.
2652 if (_this._opened) {
2653 _this._opened = false;
2654 _this.closedStream.emit();
2655 _this._focusedElementBeforeOpen = null;
2656 }
2657 };
2658 if (this._restoreFocus && this._focusedElementBeforeOpen &&
2659 typeof this._focusedElementBeforeOpen.focus === 'function') {
2660 // Because IE moves focus asynchronously, we can't count on it being restored before we've
2661 // marked the datepicker as closed. If the event fires out of sequence and the element that
2662 // we're refocusing opens the datepicker on focus, the user could be stuck with not being
2663 // able to close the calendar at all. We work around it by making the logic, that marks
2664 // the datepicker as closed, async as well.
2665 this._focusedElementBeforeOpen.focus();
2666 setTimeout(completeClose);
2667 }
2668 else {
2669 completeClose();
2670 }
2671 };
2672 /** Applies the current pending selection on the overlay to the model. */
2673 MatDatepickerBase.prototype._applyPendingSelection = function () {
2674 var _a, _b;
2675 (_b = (_a = this._componentRef) === null || _a === void 0 ? void 0 : _a.instance) === null || _b === void 0 ? void 0 : _b._applyPendingSelection();
2676 };
2677 /** Forwards relevant values from the datepicker to the datepicker content inside the overlay. */
2678 MatDatepickerBase.prototype._forwardContentValues = function (instance) {
2679 instance.datepicker = this;
2680 instance.color = this.color;
2681 instance._actionsPortal = this._actionsPortal;
2682 };
2683 /** Opens the overlay with the calendar. */
2684 MatDatepickerBase.prototype._openOverlay = function () {
2685 var _this = this;
2686 this._destroyOverlay();
2687 var isDialog = this.touchUi;
2688 var labelId = this.datepickerInput.getOverlayLabelId();
2689 var portal$1 = new portal.ComponentPortal(MatDatepickerContent, this._viewContainerRef);
2690 var overlayRef = this._overlayRef = this._overlay.create(new overlay.OverlayConfig({
2691 positionStrategy: isDialog ? this._getDialogStrategy() : this._getDropdownStrategy(),
2692 hasBackdrop: true,
2693 backdropClass: [
2694 isDialog ? 'cdk-overlay-dark-backdrop' : 'mat-overlay-transparent-backdrop',
2695 this._backdropHarnessClass
2696 ],
2697 direction: this._dir,
2698 scrollStrategy: isDialog ? this._overlay.scrollStrategies.block() : this._scrollStrategy(),
2699 panelClass: "mat-datepicker-" + (isDialog ? 'dialog' : 'popup'),
2700 }));
2701 var overlayElement = overlayRef.overlayElement;
2702 overlayElement.setAttribute('role', 'dialog');
2703 if (labelId) {
2704 overlayElement.setAttribute('aria-labelledby', labelId);
2705 }
2706 if (isDialog) {
2707 overlayElement.setAttribute('aria-modal', 'true');
2708 }
2709 this._getCloseStream(overlayRef).subscribe(function (event) {
2710 if (event) {
2711 event.preventDefault();
2712 }
2713 _this.close();
2714 });
2715 this._componentRef = overlayRef.attach(portal$1);
2716 this._forwardContentValues(this._componentRef.instance);
2717 // Update the position once the calendar has rendered. Only relevant in dropdown mode.
2718 if (!isDialog) {
2719 this._ngZone.onStable.pipe(operators.take(1)).subscribe(function () { return overlayRef.updatePosition(); });
2720 }
2721 };
2722 /** Destroys the current overlay. */
2723 MatDatepickerBase.prototype._destroyOverlay = function () {
2724 if (this._overlayRef) {
2725 this._overlayRef.dispose();
2726 this._overlayRef = this._componentRef = null;
2727 }
2728 };
2729 /** Gets a position strategy that will open the calendar as a dropdown. */
2730 MatDatepickerBase.prototype._getDialogStrategy = function () {
2731 return this._overlay.position().global().centerHorizontally().centerVertically();
2732 };
2733 /** Gets a position strategy that will open the calendar as a dropdown. */
2734 MatDatepickerBase.prototype._getDropdownStrategy = function () {
2735 var strategy = this._overlay.position()
2736 .flexibleConnectedTo(this.datepickerInput.getConnectedOverlayOrigin())
2737 .withTransformOriginOn('.mat-datepicker-content')
2738 .withFlexibleDimensions(false)
2739 .withViewportMargin(8)
2740 .withLockedPosition();
2741 return this._setConnectedPositions(strategy);
2742 };
2743 /** Sets the positions of the datepicker in dropdown mode based on the current configuration. */
2744 MatDatepickerBase.prototype._setConnectedPositions = function (strategy) {
2745 var primaryX = this.xPosition === 'end' ? 'end' : 'start';
2746 var secondaryX = primaryX === 'start' ? 'end' : 'start';
2747 var primaryY = this.yPosition === 'above' ? 'bottom' : 'top';
2748 var secondaryY = primaryY === 'top' ? 'bottom' : 'top';
2749 return strategy.withPositions([
2750 {
2751 originX: primaryX,
2752 originY: secondaryY,
2753 overlayX: primaryX,
2754 overlayY: primaryY
2755 },
2756 {
2757 originX: primaryX,
2758 originY: primaryY,
2759 overlayX: primaryX,
2760 overlayY: secondaryY
2761 },
2762 {
2763 originX: secondaryX,
2764 originY: secondaryY,
2765 overlayX: secondaryX,
2766 overlayY: primaryY
2767 },
2768 {
2769 originX: secondaryX,
2770 originY: primaryY,
2771 overlayX: secondaryX,
2772 overlayY: secondaryY
2773 }
2774 ]);
2775 };
2776 /** Gets an observable that will emit when the overlay is supposed to be closed. */
2777 MatDatepickerBase.prototype._getCloseStream = function (overlayRef) {
2778 var _this = this;
2779 return rxjs.merge(overlayRef.backdropClick(), overlayRef.detachments(), overlayRef.keydownEvents().pipe(operators.filter(function (event) {
2780 // Closing on alt + up is only valid when there's an input associated with the datepicker.
2781 return (event.keyCode === keycodes.ESCAPE && !keycodes.hasModifierKey(event)) || (_this.datepickerInput &&
2782 keycodes.hasModifierKey(event, 'altKey') && event.keyCode === keycodes.UP_ARROW);
2783 })));
2784 };
2785 return MatDatepickerBase;
2786 }());
2787 MatDatepickerBase.decorators = [
2788 { type: i0.Directive }
2789 ];
2790 MatDatepickerBase.ctorParameters = function () { return [
2791 { type: undefined, decorators: [{ type: i0.Inject, args: [i0.ElementRef,] }] },
2792 { type: overlay.Overlay },
2793 { type: i0.NgZone },
2794 { type: i0.ViewContainerRef },
2795 { type: undefined, decorators: [{ type: i0.Inject, args: [MAT_DATEPICKER_SCROLL_STRATEGY,] }] },
2796 { type: core.DateAdapter, decorators: [{ type: i0.Optional }] },
2797 { type: bidi.Directionality, decorators: [{ type: i0.Optional }] },
2798 { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [common.DOCUMENT,] }] },
2799 { type: MatDateSelectionModel }
2800 ]; };
2801 MatDatepickerBase.propDecorators = {
2802 calendarHeaderComponent: [{ type: i0.Input }],
2803 startAt: [{ type: i0.Input }],
2804 startView: [{ type: i0.Input }],
2805 color: [{ type: i0.Input }],
2806 touchUi: [{ type: i0.Input }],
2807 disabled: [{ type: i0.Input }],
2808 xPosition: [{ type: i0.Input }],
2809 yPosition: [{ type: i0.Input }],
2810 restoreFocus: [{ type: i0.Input }],
2811 yearSelected: [{ type: i0.Output }],
2812 monthSelected: [{ type: i0.Output }],
2813 viewChanged: [{ type: i0.Output }],
2814 dateClass: [{ type: i0.Input }],
2815 openedStream: [{ type: i0.Output, args: ['opened',] }],
2816 closedStream: [{ type: i0.Output, args: ['closed',] }],
2817 panelClass: [{ type: i0.Input }],
2818 opened: [{ type: i0.Input }]
2819 };
2820
2821 // TODO(mmalerba): We use a component instead of a directive here so the user can use implicit
2822 // template reference variables (e.g. #d vs #d="matDatepicker"). We can change this to a directive
2823 // if angular adds support for `exportAs: '$implicit'` on directives.
2824 /** Component responsible for managing the datepicker popup/dialog. */
2825 var MatDatepicker = /** @class */ (function (_super) {
2826 __extends(MatDatepicker, _super);
2827 function MatDatepicker() {
2828 return _super !== null && _super.apply(this, arguments) || this;
2829 }
2830 return MatDatepicker;
2831 }(MatDatepickerBase));
2832 MatDatepicker.decorators = [
2833 { type: i0.Component, args: [{
2834 selector: 'mat-datepicker',
2835 template: '',
2836 exportAs: 'matDatepicker',
2837 changeDetection: i0.ChangeDetectionStrategy.OnPush,
2838 encapsulation: i0.ViewEncapsulation.None,
2839 providers: [
2840 MAT_SINGLE_DATE_SELECTION_MODEL_PROVIDER,
2841 { provide: MatDatepickerBase, useExisting: MatDatepicker },
2842 ]
2843 },] }
2844 ];
2845
2846 /**
2847 * An event used for datepicker input and change events. We don't always have access to a native
2848 * input or change event because the event may have been triggered by the user clicking on the
2849 * calendar popup. For consistency, we always use MatDatepickerInputEvent instead.
2850 */
2851 var MatDatepickerInputEvent = /** @class */ (function () {
2852 function MatDatepickerInputEvent(
2853 /** Reference to the datepicker input component that emitted the event. */
2854 target,
2855 /** Reference to the native input element associated with the datepicker input. */
2856 targetElement) {
2857 this.target = target;
2858 this.targetElement = targetElement;
2859 this.value = this.target.value;
2860 }
2861 return MatDatepickerInputEvent;
2862 }());
2863 /** Base class for datepicker inputs. */
2864 var MatDatepickerInputBase = /** @class */ (function () {
2865 function MatDatepickerInputBase(_elementRef, _dateAdapter, _dateFormats) {
2866 var _this = this;
2867 this._elementRef = _elementRef;
2868 this._dateAdapter = _dateAdapter;
2869 this._dateFormats = _dateFormats;
2870 /** Emits when a `change` event is fired on this `<input>`. */
2871 this.dateChange = new i0.EventEmitter();
2872 /** Emits when an `input` event is fired on this `<input>`. */
2873 this.dateInput = new i0.EventEmitter();
2874 /** Emits when the internal state has changed */
2875 this.stateChanges = new rxjs.Subject();
2876 this._onTouched = function () { };
2877 this._validatorOnChange = function () { };
2878 this._cvaOnChange = function () { };
2879 this._valueChangesSubscription = rxjs.Subscription.EMPTY;
2880 this._localeSubscription = rxjs.Subscription.EMPTY;
2881 /** The form control validator for whether the input parses. */
2882 this._parseValidator = function () {
2883 return _this._lastValueValid ?
2884 null : { 'matDatepickerParse': { 'text': _this._elementRef.nativeElement.value } };
2885 };
2886 /** The form control validator for the date filter. */
2887 this._filterValidator = function (control) {
2888 var controlValue = _this._dateAdapter.getValidDateOrNull(_this._dateAdapter.deserialize(control.value));
2889 return !controlValue || _this._matchesFilter(controlValue) ?
2890 null : { 'matDatepickerFilter': true };
2891 };
2892 /** The form control validator for the min date. */
2893 this._minValidator = function (control) {
2894 var controlValue = _this._dateAdapter.getValidDateOrNull(_this._dateAdapter.deserialize(control.value));
2895 var min = _this._getMinDate();
2896 return (!min || !controlValue ||
2897 _this._dateAdapter.compareDate(min, controlValue) <= 0) ?
2898 null : { 'matDatepickerMin': { 'min': min, 'actual': controlValue } };
2899 };
2900 /** The form control validator for the max date. */
2901 this._maxValidator = function (control) {
2902 var controlValue = _this._dateAdapter.getValidDateOrNull(_this._dateAdapter.deserialize(control.value));
2903 var max = _this._getMaxDate();
2904 return (!max || !controlValue ||
2905 _this._dateAdapter.compareDate(max, controlValue) >= 0) ?
2906 null : { 'matDatepickerMax': { 'max': max, 'actual': controlValue } };
2907 };
2908 /** Whether the last value set on the input was valid. */
2909 this._lastValueValid = false;
2910 if (typeof ngDevMode === 'undefined' || ngDevMode) {
2911 if (!this._dateAdapter) {
2912 throw createMissingDateImplError('DateAdapter');
2913 }
2914 if (!this._dateFormats) {
2915 throw createMissingDateImplError('MAT_DATE_FORMATS');
2916 }
2917 }
2918 // Update the displayed date when the locale changes.
2919 this._localeSubscription = _dateAdapter.localeChanges.subscribe(function () {
2920 _this._assignValueProgrammatically(_this.value);
2921 });
2922 }
2923 Object.defineProperty(MatDatepickerInputBase.prototype, "value", {
2924 /** The value of the input. */
2925 get: function () {
2926 return this._model ? this._getValueFromModel(this._model.selection) : this._pendingValue;
2927 },
2928 set: function (value) {
2929 this._assignValueProgrammatically(value);
2930 },
2931 enumerable: false,
2932 configurable: true
2933 });
2934 Object.defineProperty(MatDatepickerInputBase.prototype, "disabled", {
2935 /** Whether the datepicker-input is disabled. */
2936 get: function () { return !!this._disabled || this._parentDisabled(); },
2937 set: function (value) {
2938 var newValue = coercion.coerceBooleanProperty(value);
2939 var element = this._elementRef.nativeElement;
2940 if (this._disabled !== newValue) {
2941 this._disabled = newValue;
2942 this.stateChanges.next(undefined);
2943 }
2944 // We need to null check the `blur` method, because it's undefined during SSR.
2945 // In Ivy static bindings are invoked earlier, before the element is attached to the DOM.
2946 // This can cause an error to be thrown in some browsers (IE/Edge) which assert that the
2947 // element has been inserted.
2948 if (newValue && this._isInitialized && element.blur) {
2949 // Normally, native input elements automatically blur if they turn disabled. This behavior
2950 // is problematic, because it would mean that it triggers another change detection cycle,
2951 // which then causes a changed after checked error if the input element was focused before.
2952 element.blur();
2953 }
2954 },
2955 enumerable: false,
2956 configurable: true
2957 });
2958 /** Gets the base validator functions. */
2959 MatDatepickerInputBase.prototype._getValidators = function () {
2960 return [this._parseValidator, this._minValidator, this._maxValidator, this._filterValidator];
2961 };
2962 /** Registers a date selection model with the input. */
2963 MatDatepickerInputBase.prototype._registerModel = function (model) {
2964 var _this = this;
2965 this._model = model;
2966 this._valueChangesSubscription.unsubscribe();
2967 if (this._pendingValue) {
2968 this._assignValue(this._pendingValue);
2969 }
2970 this._valueChangesSubscription = this._model.selectionChanged.subscribe(function (event) {
2971 if (_this._shouldHandleChangeEvent(event)) {
2972 var value = _this._getValueFromModel(event.selection);
2973 _this._lastValueValid = _this._isValidValue(value);
2974 _this._cvaOnChange(value);
2975 _this._onTouched();
2976 _this._formatValue(value);
2977 _this.dateInput.emit(new MatDatepickerInputEvent(_this, _this._elementRef.nativeElement));
2978 _this.dateChange.emit(new MatDatepickerInputEvent(_this, _this._elementRef.nativeElement));
2979 }
2980 });
2981 };
2982 MatDatepickerInputBase.prototype.ngAfterViewInit = function () {
2983 this._isInitialized = true;
2984 };
2985 MatDatepickerInputBase.prototype.ngOnChanges = function (changes) {
2986 if (dateInputsHaveChanged(changes, this._dateAdapter)) {
2987 this.stateChanges.next(undefined);
2988 }
2989 };
2990 MatDatepickerInputBase.prototype.ngOnDestroy = function () {
2991 this._valueChangesSubscription.unsubscribe();
2992 this._localeSubscription.unsubscribe();
2993 this.stateChanges.complete();
2994 };
2995 /** @docs-private */
2996 MatDatepickerInputBase.prototype.registerOnValidatorChange = function (fn) {
2997 this._validatorOnChange = fn;
2998 };
2999 /** @docs-private */
3000 MatDatepickerInputBase.prototype.validate = function (c) {
3001 return this._validator ? this._validator(c) : null;
3002 };
3003 // Implemented as part of ControlValueAccessor.
3004 MatDatepickerInputBase.prototype.writeValue = function (value) {
3005 this._assignValueProgrammatically(value);
3006 };
3007 // Implemented as part of ControlValueAccessor.
3008 MatDatepickerInputBase.prototype.registerOnChange = function (fn) {
3009 this._cvaOnChange = fn;
3010 };
3011 // Implemented as part of ControlValueAccessor.
3012 MatDatepickerInputBase.prototype.registerOnTouched = function (fn) {
3013 this._onTouched = fn;
3014 };
3015 // Implemented as part of ControlValueAccessor.
3016 MatDatepickerInputBase.prototype.setDisabledState = function (isDisabled) {
3017 this.disabled = isDisabled;
3018 };
3019 MatDatepickerInputBase.prototype._onKeydown = function (event) {
3020 var isAltDownArrow = event.altKey && event.keyCode === keycodes.DOWN_ARROW;
3021 if (isAltDownArrow && !this._elementRef.nativeElement.readOnly) {
3022 this._openPopup();
3023 event.preventDefault();
3024 }
3025 };
3026 MatDatepickerInputBase.prototype._onInput = function (value) {
3027 var lastValueWasValid = this._lastValueValid;
3028 var date = this._dateAdapter.parse(value, this._dateFormats.parse.dateInput);
3029 this._lastValueValid = this._isValidValue(date);
3030 date = this._dateAdapter.getValidDateOrNull(date);
3031 if (!this._dateAdapter.sameDate(date, this.value)) {
3032 this._assignValue(date);
3033 this._cvaOnChange(date);
3034 this.dateInput.emit(new MatDatepickerInputEvent(this, this._elementRef.nativeElement));
3035 }
3036 else {
3037 // Call the CVA change handler for invalid values
3038 // since this is what marks the control as dirty.
3039 if (value && !this.value) {
3040 this._cvaOnChange(date);
3041 }
3042 if (lastValueWasValid !== this._lastValueValid) {
3043 this._validatorOnChange();
3044 }
3045 }
3046 };
3047 MatDatepickerInputBase.prototype._onChange = function () {
3048 this.dateChange.emit(new MatDatepickerInputEvent(this, this._elementRef.nativeElement));
3049 };
3050 /** Handles blur events on the input. */
3051 MatDatepickerInputBase.prototype._onBlur = function () {
3052 // Reformat the input only if we have a valid value.
3053 if (this.value) {
3054 this._formatValue(this.value);
3055 }
3056 this._onTouched();
3057 };
3058 /** Formats a value and sets it on the input element. */
3059 MatDatepickerInputBase.prototype._formatValue = function (value) {
3060 this._elementRef.nativeElement.value =
3061 value ? this._dateAdapter.format(value, this._dateFormats.display.dateInput) : '';
3062 };
3063 /** Assigns a value to the model. */
3064 MatDatepickerInputBase.prototype._assignValue = function (value) {
3065 // We may get some incoming values before the model was
3066 // assigned. Save the value so that we can assign it later.
3067 if (this._model) {
3068 this._assignValueToModel(value);
3069 this._pendingValue = null;
3070 }
3071 else {
3072 this._pendingValue = value;
3073 }
3074 };
3075 /** Whether a value is considered valid. */
3076 MatDatepickerInputBase.prototype._isValidValue = function (value) {
3077 return !value || this._dateAdapter.isValid(value);
3078 };
3079 /**
3080 * Checks whether a parent control is disabled. This is in place so that it can be overridden
3081 * by inputs extending this one which can be placed inside of a group that can be disabled.
3082 */
3083 MatDatepickerInputBase.prototype._parentDisabled = function () {
3084 return false;
3085 };
3086 /** Programmatically assigns a value to the input. */
3087 MatDatepickerInputBase.prototype._assignValueProgrammatically = function (value) {
3088 value = this._dateAdapter.deserialize(value);
3089 this._lastValueValid = this._isValidValue(value);
3090 value = this._dateAdapter.getValidDateOrNull(value);
3091 this._assignValue(value);
3092 this._formatValue(value);
3093 };
3094 /** Gets whether a value matches the current date filter. */
3095 MatDatepickerInputBase.prototype._matchesFilter = function (value) {
3096 var filter = this._getDateFilter();
3097 return !filter || filter(value);
3098 };
3099 return MatDatepickerInputBase;
3100 }());
3101 MatDatepickerInputBase.decorators = [
3102 { type: i0.Directive }
3103 ];
3104 MatDatepickerInputBase.ctorParameters = function () { return [
3105 { type: i0.ElementRef },
3106 { type: core.DateAdapter, decorators: [{ type: i0.Optional }] },
3107 { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [core.MAT_DATE_FORMATS,] }] }
3108 ]; };
3109 MatDatepickerInputBase.propDecorators = {
3110 value: [{ type: i0.Input }],
3111 disabled: [{ type: i0.Input }],
3112 dateChange: [{ type: i0.Output }],
3113 dateInput: [{ type: i0.Output }]
3114 };
3115 /**
3116 * Checks whether the `SimpleChanges` object from an `ngOnChanges`
3117 * callback has any changes, accounting for date objects.
3118 */
3119 function dateInputsHaveChanged(changes, adapter) {
3120 var e_1, _a;
3121 var keys = Object.keys(changes);
3122 try {
3123 for (var keys_1 = __values(keys), keys_1_1 = keys_1.next(); !keys_1_1.done; keys_1_1 = keys_1.next()) {
3124 var key = keys_1_1.value;
3125 var _b = changes[key], previousValue = _b.previousValue, currentValue = _b.currentValue;
3126 if (adapter.isDateInstance(previousValue) && adapter.isDateInstance(currentValue)) {
3127 if (!adapter.sameDate(previousValue, currentValue)) {
3128 return true;
3129 }
3130 }
3131 else {
3132 return true;
3133 }
3134 }
3135 }
3136 catch (e_1_1) { e_1 = { error: e_1_1 }; }
3137 finally {
3138 try {
3139 if (keys_1_1 && !keys_1_1.done && (_a = keys_1.return)) _a.call(keys_1);
3140 }
3141 finally { if (e_1) throw e_1.error; }
3142 }
3143 return false;
3144 }
3145
3146 /** @docs-private */
3147 var MAT_DATEPICKER_VALUE_ACCESSOR = {
3148 provide: forms.NG_VALUE_ACCESSOR,
3149 useExisting: i0.forwardRef(function () { return MatDatepickerInput; }),
3150 multi: true
3151 };
3152 /** @docs-private */
3153 var MAT_DATEPICKER_VALIDATORS = {
3154 provide: forms.NG_VALIDATORS,
3155 useExisting: i0.forwardRef(function () { return MatDatepickerInput; }),
3156 multi: true
3157 };
3158 /** Directive used to connect an input to a MatDatepicker. */
3159 var MatDatepickerInput = /** @class */ (function (_super) {
3160 __extends(MatDatepickerInput, _super);
3161 function MatDatepickerInput(elementRef, dateAdapter, dateFormats, _formField) {
3162 var _this = _super.call(this, elementRef, dateAdapter, dateFormats) || this;
3163 _this._formField = _formField;
3164 _this._closedSubscription = rxjs.Subscription.EMPTY;
3165 _this._validator = forms.Validators.compose(_super.prototype._getValidators.call(_this));
3166 return _this;
3167 }
3168 Object.defineProperty(MatDatepickerInput.prototype, "matDatepicker", {
3169 /** The datepicker that this input is associated with. */
3170 set: function (datepicker) {
3171 var _this = this;
3172 if (datepicker) {
3173 this._datepicker = datepicker;
3174 this._closedSubscription = datepicker.closedStream.subscribe(function () { return _this._onTouched(); });
3175 this._registerModel(datepicker.registerInput(this));
3176 }
3177 },
3178 enumerable: false,
3179 configurable: true
3180 });
3181 Object.defineProperty(MatDatepickerInput.prototype, "min", {
3182 /** The minimum valid date. */
3183 get: function () { return this._min; },
3184 set: function (value) {
3185 var validValue = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
3186 if (!this._dateAdapter.sameDate(validValue, this._min)) {
3187 this._min = validValue;
3188 this._validatorOnChange();
3189 }
3190 },
3191 enumerable: false,
3192 configurable: true
3193 });
3194 Object.defineProperty(MatDatepickerInput.prototype, "max", {
3195 /** The maximum valid date. */
3196 get: function () { return this._max; },
3197 set: function (value) {
3198 var validValue = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
3199 if (!this._dateAdapter.sameDate(validValue, this._max)) {
3200 this._max = validValue;
3201 this._validatorOnChange();
3202 }
3203 },
3204 enumerable: false,
3205 configurable: true
3206 });
3207 Object.defineProperty(MatDatepickerInput.prototype, "dateFilter", {
3208 /** Function that can be used to filter out dates within the datepicker. */
3209 get: function () { return this._dateFilter; },
3210 set: function (value) {
3211 var wasMatchingValue = this._matchesFilter(this.value);
3212 this._dateFilter = value;
3213 if (this._matchesFilter(this.value) !== wasMatchingValue) {
3214 this._validatorOnChange();
3215 }
3216 },
3217 enumerable: false,
3218 configurable: true
3219 });
3220 /**
3221 * Gets the element that the datepicker popup should be connected to.
3222 * @return The element to connect the popup to.
3223 */
3224 MatDatepickerInput.prototype.getConnectedOverlayOrigin = function () {
3225 return this._formField ? this._formField.getConnectedOverlayOrigin() : this._elementRef;
3226 };
3227 /** Gets the ID of an element that should be used a description for the calendar overlay. */
3228 MatDatepickerInput.prototype.getOverlayLabelId = function () {
3229 if (this._formField) {
3230 return this._formField.getLabelId();
3231 }
3232 return this._elementRef.nativeElement.getAttribute('aria-labelledby');
3233 };
3234 /** Returns the palette used by the input's form field, if any. */
3235 MatDatepickerInput.prototype.getThemePalette = function () {
3236 return this._formField ? this._formField.color : undefined;
3237 };
3238 /** Gets the value at which the calendar should start. */
3239 MatDatepickerInput.prototype.getStartValue = function () {
3240 return this.value;
3241 };
3242 MatDatepickerInput.prototype.ngOnDestroy = function () {
3243 _super.prototype.ngOnDestroy.call(this);
3244 this._closedSubscription.unsubscribe();
3245 };
3246 /** Opens the associated datepicker. */
3247 MatDatepickerInput.prototype._openPopup = function () {
3248 if (this._datepicker) {
3249 this._datepicker.open();
3250 }
3251 };
3252 MatDatepickerInput.prototype._getValueFromModel = function (modelValue) {
3253 return modelValue;
3254 };
3255 MatDatepickerInput.prototype._assignValueToModel = function (value) {
3256 if (this._model) {
3257 this._model.updateSelection(value, this);
3258 }
3259 };
3260 /** Gets the input's minimum date. */
3261 MatDatepickerInput.prototype._getMinDate = function () {
3262 return this._min;
3263 };
3264 /** Gets the input's maximum date. */
3265 MatDatepickerInput.prototype._getMaxDate = function () {
3266 return this._max;
3267 };
3268 /** Gets the input's date filtering function. */
3269 MatDatepickerInput.prototype._getDateFilter = function () {
3270 return this._dateFilter;
3271 };
3272 MatDatepickerInput.prototype._shouldHandleChangeEvent = function (event) {
3273 return event.source !== this;
3274 };
3275 return MatDatepickerInput;
3276 }(MatDatepickerInputBase));
3277 MatDatepickerInput.decorators = [
3278 { type: i0.Directive, args: [{
3279 selector: 'input[matDatepicker]',
3280 providers: [
3281 MAT_DATEPICKER_VALUE_ACCESSOR,
3282 MAT_DATEPICKER_VALIDATORS,
3283 { provide: input.MAT_INPUT_VALUE_ACCESSOR, useExisting: MatDatepickerInput },
3284 ],
3285 host: {
3286 'class': 'mat-datepicker-input',
3287 '[attr.aria-haspopup]': '_datepicker ? "dialog" : null',
3288 '[attr.aria-owns]': '(_datepicker?.opened && _datepicker.id) || null',
3289 '[attr.min]': 'min ? _dateAdapter.toIso8601(min) : null',
3290 '[attr.max]': 'max ? _dateAdapter.toIso8601(max) : null',
3291 // Used by the test harness to tie this input to its calendar. We can't depend on
3292 // `aria-owns` for this, because it's only defined while the calendar is open.
3293 '[attr.data-mat-calendar]': '_datepicker ? _datepicker.id : null',
3294 '[disabled]': 'disabled',
3295 '(input)': '_onInput($event.target.value)',
3296 '(change)': '_onChange()',
3297 '(blur)': '_onBlur()',
3298 '(keydown)': '_onKeydown($event)',
3299 },
3300 exportAs: 'matDatepickerInput',
3301 },] }
3302 ];
3303 MatDatepickerInput.ctorParameters = function () { return [
3304 { type: i0.ElementRef },
3305 { type: core.DateAdapter, decorators: [{ type: i0.Optional }] },
3306 { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [core.MAT_DATE_FORMATS,] }] },
3307 { type: formField.MatFormField, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [formField.MAT_FORM_FIELD,] }] }
3308 ]; };
3309 MatDatepickerInput.propDecorators = {
3310 matDatepicker: [{ type: i0.Input }],
3311 min: [{ type: i0.Input }],
3312 max: [{ type: i0.Input }],
3313 dateFilter: [{ type: i0.Input, args: ['matDatepickerFilter',] }]
3314 };
3315
3316 /**
3317 * @license
3318 * Copyright Google LLC All Rights Reserved.
3319 *
3320 * Use of this source code is governed by an MIT-style license that can be
3321 * found in the LICENSE file at https://angular.io/license
3322 */
3323 /** Can be used to override the icon of a `matDatepickerToggle`. */
3324 var MatDatepickerToggleIcon = /** @class */ (function () {
3325 function MatDatepickerToggleIcon() {
3326 }
3327 return MatDatepickerToggleIcon;
3328 }());
3329 MatDatepickerToggleIcon.decorators = [
3330 { type: i0.Directive, args: [{
3331 selector: '[matDatepickerToggleIcon]'
3332 },] }
3333 ];
3334 var MatDatepickerToggle = /** @class */ (function () {
3335 function MatDatepickerToggle(_intl, _changeDetectorRef, defaultTabIndex) {
3336 this._intl = _intl;
3337 this._changeDetectorRef = _changeDetectorRef;
3338 this._stateChanges = rxjs.Subscription.EMPTY;
3339 var parsedTabIndex = Number(defaultTabIndex);
3340 this.tabIndex = (parsedTabIndex || parsedTabIndex === 0) ? parsedTabIndex : null;
3341 }
3342 Object.defineProperty(MatDatepickerToggle.prototype, "disabled", {
3343 /** Whether the toggle button is disabled. */
3344 get: function () {
3345 if (this._disabled === undefined && this.datepicker) {
3346 return this.datepicker.disabled;
3347 }
3348 return !!this._disabled;
3349 },
3350 set: function (value) {
3351 this._disabled = coercion.coerceBooleanProperty(value);
3352 },
3353 enumerable: false,
3354 configurable: true
3355 });
3356 MatDatepickerToggle.prototype.ngOnChanges = function (changes) {
3357 if (changes['datepicker']) {
3358 this._watchStateChanges();
3359 }
3360 };
3361 MatDatepickerToggle.prototype.ngOnDestroy = function () {
3362 this._stateChanges.unsubscribe();
3363 };
3364 MatDatepickerToggle.prototype.ngAfterContentInit = function () {
3365 this._watchStateChanges();
3366 };
3367 MatDatepickerToggle.prototype._open = function (event) {
3368 if (this.datepicker && !this.disabled) {
3369 this.datepicker.open();
3370 event.stopPropagation();
3371 }
3372 };
3373 MatDatepickerToggle.prototype._watchStateChanges = function () {
3374 var _this = this;
3375 var datepickerStateChanged = this.datepicker ? this.datepicker.stateChanges : rxjs.of();
3376 var inputStateChanged = this.datepicker && this.datepicker.datepickerInput ?
3377 this.datepicker.datepickerInput.stateChanges : rxjs.of();
3378 var datepickerToggled = this.datepicker ?
3379 rxjs.merge(this.datepicker.openedStream, this.datepicker.closedStream) :
3380 rxjs.of();
3381 this._stateChanges.unsubscribe();
3382 this._stateChanges = rxjs.merge(this._intl.changes, datepickerStateChanged, inputStateChanged, datepickerToggled).subscribe(function () { return _this._changeDetectorRef.markForCheck(); });
3383 };
3384 return MatDatepickerToggle;
3385 }());
3386 MatDatepickerToggle.decorators = [
3387 { type: i0.Component, args: [{
3388 selector: 'mat-datepicker-toggle',
3389 template: "<button\n #button\n mat-icon-button\n type=\"button\"\n [attr.aria-haspopup]=\"datepicker ? 'dialog' : null\"\n [attr.aria-label]=\"ariaLabel || _intl.openCalendarLabel\"\n [attr.tabindex]=\"disabled ? -1 : tabIndex\"\n [disabled]=\"disabled\"\n [disableRipple]=\"disableRipple\">\n\n <svg\n *ngIf=\"!_customIcon\"\n class=\"mat-datepicker-toggle-default-icon\"\n viewBox=\"0 0 24 24\"\n width=\"24px\"\n height=\"24px\"\n fill=\"currentColor\"\n focusable=\"false\">\n <path 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\n <ng-content select=\"[matDatepickerToggleIcon]\"></ng-content>\n</button>\n",
3390 host: {
3391 'class': 'mat-datepicker-toggle',
3392 '[attr.tabindex]': 'null',
3393 '[class.mat-datepicker-toggle-active]': 'datepicker && datepicker.opened',
3394 '[class.mat-accent]': 'datepicker && datepicker.color === "accent"',
3395 '[class.mat-warn]': 'datepicker && datepicker.color === "warn"',
3396 // Used by the test harness to tie this toggle to its datepicker.
3397 '[attr.data-mat-calendar]': 'datepicker ? datepicker.id : null',
3398 // Bind the `click` on the host, rather than the inner `button`, so that we can call
3399 // `stopPropagation` on it without affecting the user's `click` handlers. We need to stop
3400 // it so that the input doesn't get focused automatically by the form field (See #21836).
3401 '(click)': '_open($event)',
3402 },
3403 exportAs: 'matDatepickerToggle',
3404 encapsulation: i0.ViewEncapsulation.None,
3405 changeDetection: i0.ChangeDetectionStrategy.OnPush,
3406 styles: [".mat-form-field-appearance-legacy .mat-form-field-prefix .mat-datepicker-toggle-default-icon,.mat-form-field-appearance-legacy .mat-form-field-suffix .mat-datepicker-toggle-default-icon{width:1em}.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-prefix .mat-datepicker-toggle-default-icon,.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-suffix .mat-datepicker-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 .mat-datepicker-toggle-default-icon,.mat-form-field:not(.mat-form-field-appearance-legacy) .mat-form-field-suffix .mat-icon-button .mat-datepicker-toggle-default-icon{margin:auto}.cdk-high-contrast-active .mat-datepicker-toggle-default-icon{color:CanvasText}\n"]
3407 },] }
3408 ];
3409 MatDatepickerToggle.ctorParameters = function () { return [
3410 { type: MatDatepickerIntl },
3411 { type: i0.ChangeDetectorRef },
3412 { type: String, decorators: [{ type: i0.Attribute, args: ['tabindex',] }] }
3413 ]; };
3414 MatDatepickerToggle.propDecorators = {
3415 datepicker: [{ type: i0.Input, args: ['for',] }],
3416 tabIndex: [{ type: i0.Input }],
3417 ariaLabel: [{ type: i0.Input, args: ['aria-label',] }],
3418 disabled: [{ type: i0.Input }],
3419 disableRipple: [{ type: i0.Input }],
3420 _customIcon: [{ type: i0.ContentChild, args: [MatDatepickerToggleIcon,] }],
3421 _button: [{ type: i0.ViewChild, args: ['button',] }]
3422 };
3423
3424 /**
3425 * Used to provide the date range input wrapper component
3426 * to the parts without circular dependencies.
3427 */
3428 var MAT_DATE_RANGE_INPUT_PARENT = new i0.InjectionToken('MAT_DATE_RANGE_INPUT_PARENT');
3429 /**
3430 * Base class for the individual inputs that can be projected inside a `mat-date-range-input`.
3431 */
3432 var MatDateRangeInputPartBase = /** @class */ (function (_super) {
3433 __extends(MatDateRangeInputPartBase, _super);
3434 function MatDateRangeInputPartBase(_rangeInput, elementRef, _defaultErrorStateMatcher, _injector, _parentForm, _parentFormGroup, dateAdapter, dateFormats) {
3435 var _this = _super.call(this, elementRef, dateAdapter, dateFormats) || this;
3436 _this._rangeInput = _rangeInput;
3437 _this._defaultErrorStateMatcher = _defaultErrorStateMatcher;
3438 _this._injector = _injector;
3439 _this._parentForm = _parentForm;
3440 _this._parentFormGroup = _parentFormGroup;
3441 return _this;
3442 }
3443 MatDateRangeInputPartBase.prototype.ngOnInit = function () {
3444 // We need the date input to provide itself as a `ControlValueAccessor` and a `Validator`, while
3445 // injecting its `NgControl` so that the error state is handled correctly. This introduces a
3446 // circular dependency, because both `ControlValueAccessor` and `Validator` depend on the input
3447 // itself. Usually we can work around it for the CVA, but there's no API to do it for the
3448 // validator. We work around it here by injecting the `NgControl` in `ngOnInit`, after
3449 // everything has been resolved.
3450 // tslint:disable-next-line:no-bitwise
3451 var ngControl = this._injector.get(forms.NgControl, null, i0.InjectFlags.Self | i0.InjectFlags.Optional);
3452 if (ngControl) {
3453 this.ngControl = ngControl;
3454 }
3455 };
3456 MatDateRangeInputPartBase.prototype.ngDoCheck = function () {
3457 if (this.ngControl) {
3458 // We need to re-evaluate this on every change detection cycle, because there are some
3459 // error triggers that we can't subscribe to (e.g. parent form submissions). This means
3460 // that whatever logic is in here has to be super lean or we risk destroying the performance.
3461 this.updateErrorState();
3462 }
3463 };
3464 /** Gets whether the input is empty. */
3465 MatDateRangeInputPartBase.prototype.isEmpty = function () {
3466 return this._elementRef.nativeElement.value.length === 0;
3467 };
3468 /** Gets the placeholder of the input. */
3469 MatDateRangeInputPartBase.prototype._getPlaceholder = function () {
3470 return this._elementRef.nativeElement.placeholder;
3471 };
3472 /** Focuses the input. */
3473 MatDateRangeInputPartBase.prototype.focus = function () {
3474 this._elementRef.nativeElement.focus();
3475 };
3476 /** Handles `input` events on the input element. */
3477 MatDateRangeInputPartBase.prototype._onInput = function (value) {
3478 _super.prototype._onInput.call(this, value);
3479 this._rangeInput._handleChildValueChange();
3480 };
3481 /** Opens the datepicker associated with the input. */
3482 MatDateRangeInputPartBase.prototype._openPopup = function () {
3483 this._rangeInput._openDatepicker();
3484 };
3485 /** Gets the minimum date from the range input. */
3486 MatDateRangeInputPartBase.prototype._getMinDate = function () {
3487 return this._rangeInput.min;
3488 };
3489 /** Gets the maximum date from the range input. */
3490 MatDateRangeInputPartBase.prototype._getMaxDate = function () {
3491 return this._rangeInput.max;
3492 };
3493 /** Gets the date filter function from the range input. */
3494 MatDateRangeInputPartBase.prototype._getDateFilter = function () {
3495 return this._rangeInput.dateFilter;
3496 };
3497 MatDateRangeInputPartBase.prototype._parentDisabled = function () {
3498 return this._rangeInput._groupDisabled;
3499 };
3500 MatDateRangeInputPartBase.prototype._shouldHandleChangeEvent = function (_b) {
3501 var source = _b.source;
3502 return source !== this._rangeInput._startInput && source !== this._rangeInput._endInput;
3503 };
3504 MatDateRangeInputPartBase.prototype._assignValueProgrammatically = function (value) {
3505 _super.prototype._assignValueProgrammatically.call(this, value);
3506 var opposite = (this === this._rangeInput._startInput ? this._rangeInput._endInput :
3507 this._rangeInput._startInput);
3508 opposite === null || opposite === void 0 ? void 0 : opposite._validatorOnChange();
3509 };
3510 return MatDateRangeInputPartBase;
3511 }(MatDatepickerInputBase));
3512 MatDateRangeInputPartBase.decorators = [
3513 { type: i0.Directive }
3514 ];
3515 MatDateRangeInputPartBase.ctorParameters = function () { return [
3516 { type: undefined, decorators: [{ type: i0.Inject, args: [MAT_DATE_RANGE_INPUT_PARENT,] }] },
3517 { type: i0.ElementRef },
3518 { type: core.ErrorStateMatcher },
3519 { type: i0.Injector },
3520 { type: forms.NgForm, decorators: [{ type: i0.Optional }] },
3521 { type: forms.FormGroupDirective, decorators: [{ type: i0.Optional }] },
3522 { type: core.DateAdapter, decorators: [{ type: i0.Optional }] },
3523 { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [core.MAT_DATE_FORMATS,] }] }
3524 ]; };
3525 var _MatDateRangeInputBase = core.mixinErrorState(MatDateRangeInputPartBase);
3526 /** Input for entering the start date in a `mat-date-range-input`. */
3527 var MatStartDate = /** @class */ (function (_super) {
3528 __extends(MatStartDate, _super);
3529 function MatStartDate(rangeInput, elementRef, defaultErrorStateMatcher, injector, parentForm, parentFormGroup, dateAdapter, dateFormats) {
3530 var _this =
3531 // TODO(crisbeto): this constructor shouldn't be necessary, but ViewEngine doesn't seem to
3532 // handle DI correctly when it is inherited from `MatDateRangeInputPartBase`. We can drop this
3533 // constructor once ViewEngine is removed.
3534 _super.call(this, rangeInput, elementRef, defaultErrorStateMatcher, injector, parentForm, parentFormGroup, dateAdapter, dateFormats) || this;
3535 /** Validator that checks that the start date isn't after the end date. */
3536 _this._startValidator = function (control) {
3537 var start = _this._dateAdapter.getValidDateOrNull(_this._dateAdapter.deserialize(control.value));
3538 var end = _this._model ? _this._model.selection.end : null;
3539 return (!start || !end ||
3540 _this._dateAdapter.compareDate(start, end) <= 0) ?
3541 null : { 'matStartDateInvalid': { 'end': end, 'actual': start } };
3542 };
3543 _this._validator = forms.Validators.compose(__spreadArray(__spreadArray([], __read(_super.prototype._getValidators.call(_this))), [_this._startValidator]));
3544 return _this;
3545 }
3546 MatStartDate.prototype.ngOnInit = function () {
3547 // Normally this happens automatically, but it seems to break if not added explicitly when all
3548 // of the criteria below are met:
3549 // 1) The class extends a TS mixin.
3550 // 2) The application is running in ViewEngine.
3551 // 3) The application is being transpiled through tsickle.
3552 // This can be removed once google3 is completely migrated to Ivy.
3553 _super.prototype.ngOnInit.call(this);
3554 };
3555 MatStartDate.prototype.ngDoCheck = function () {
3556 // Normally this happens automatically, but it seems to break if not added explicitly when all
3557 // of the criteria below are met:
3558 // 1) The class extends a TS mixin.
3559 // 2) The application is running in ViewEngine.
3560 // 3) The application is being transpiled through tsickle.
3561 // This can be removed once google3 is completely migrated to Ivy.
3562 _super.prototype.ngDoCheck.call(this);
3563 };
3564 MatStartDate.prototype._getValueFromModel = function (modelValue) {
3565 return modelValue.start;
3566 };
3567 MatStartDate.prototype._shouldHandleChangeEvent = function (change) {
3568 var _a;
3569 if (!_super.prototype._shouldHandleChangeEvent.call(this, change)) {
3570 return false;
3571 }
3572 else {
3573 return !((_a = change.oldValue) === null || _a === void 0 ? void 0 : _a.start) ? !!change.selection.start :
3574 !change.selection.start ||
3575 !!this._dateAdapter.compareDate(change.oldValue.start, change.selection.start);
3576 }
3577 };
3578 MatStartDate.prototype._assignValueToModel = function (value) {
3579 if (this._model) {
3580 var range = new DateRange(value, this._model.selection.end);
3581 this._model.updateSelection(range, this);
3582 }
3583 };
3584 MatStartDate.prototype._formatValue = function (value) {
3585 _super.prototype._formatValue.call(this, value);
3586 // Any time the input value is reformatted we need to tell the parent.
3587 this._rangeInput._handleChildValueChange();
3588 };
3589 /** Gets the value that should be used when mirroring the input's size. */
3590 MatStartDate.prototype.getMirrorValue = function () {
3591 var element = this._elementRef.nativeElement;
3592 var value = element.value;
3593 return value.length > 0 ? value : element.placeholder;
3594 };
3595 return MatStartDate;
3596 }(_MatDateRangeInputBase));
3597 MatStartDate.decorators = [
3598 { type: i0.Directive, args: [{
3599 selector: 'input[matStartDate]',
3600 host: {
3601 'class': 'mat-start-date mat-date-range-input-inner',
3602 '[disabled]': 'disabled',
3603 '(input)': '_onInput($event.target.value)',
3604 '(change)': '_onChange()',
3605 '(keydown)': '_onKeydown($event)',
3606 '[attr.id]': '_rangeInput.id',
3607 '[attr.aria-haspopup]': '_rangeInput.rangePicker ? "dialog" : null',
3608 '[attr.aria-owns]': '(_rangeInput.rangePicker?.opened && _rangeInput.rangePicker.id) || null',
3609 '[attr.min]': '_getMinDate() ? _dateAdapter.toIso8601(_getMinDate()) : null',
3610 '[attr.max]': '_getMaxDate() ? _dateAdapter.toIso8601(_getMaxDate()) : null',
3611 '(blur)': '_onBlur()',
3612 'type': 'text',
3613 },
3614 providers: [
3615 { provide: forms.NG_VALUE_ACCESSOR, useExisting: MatStartDate, multi: true },
3616 { provide: forms.NG_VALIDATORS, useExisting: MatStartDate, multi: true }
3617 ],
3618 // These need to be specified explicitly, because some tooling doesn't
3619 // seem to pick them up from the base class. See #20932.
3620 outputs: ['dateChange', 'dateInput'],
3621 inputs: ['errorStateMatcher']
3622 },] }
3623 ];
3624 MatStartDate.ctorParameters = function () { return [
3625 { type: undefined, decorators: [{ type: i0.Inject, args: [MAT_DATE_RANGE_INPUT_PARENT,] }] },
3626 { type: i0.ElementRef },
3627 { type: core.ErrorStateMatcher },
3628 { type: i0.Injector },
3629 { type: forms.NgForm, decorators: [{ type: i0.Optional }] },
3630 { type: forms.FormGroupDirective, decorators: [{ type: i0.Optional }] },
3631 { type: core.DateAdapter, decorators: [{ type: i0.Optional }] },
3632 { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [core.MAT_DATE_FORMATS,] }] }
3633 ]; };
3634 /** Input for entering the end date in a `mat-date-range-input`. */
3635 var MatEndDate = /** @class */ (function (_super) {
3636 __extends(MatEndDate, _super);
3637 function MatEndDate(rangeInput, elementRef, defaultErrorStateMatcher, injector, parentForm, parentFormGroup, dateAdapter, dateFormats) {
3638 var _this =
3639 // TODO(crisbeto): this constructor shouldn't be necessary, but ViewEngine doesn't seem to
3640 // handle DI correctly when it is inherited from `MatDateRangeInputPartBase`. We can drop this
3641 // constructor once ViewEngine is removed.
3642 _super.call(this, rangeInput, elementRef, defaultErrorStateMatcher, injector, parentForm, parentFormGroup, dateAdapter, dateFormats) || this;
3643 /** Validator that checks that the end date isn't before the start date. */
3644 _this._endValidator = function (control) {
3645 var end = _this._dateAdapter.getValidDateOrNull(_this._dateAdapter.deserialize(control.value));
3646 var start = _this._model ? _this._model.selection.start : null;
3647 return (!end || !start ||
3648 _this._dateAdapter.compareDate(end, start) >= 0) ?
3649 null : { 'matEndDateInvalid': { 'start': start, 'actual': end } };
3650 };
3651 _this._validator = forms.Validators.compose(__spreadArray(__spreadArray([], __read(_super.prototype._getValidators.call(_this))), [_this._endValidator]));
3652 return _this;
3653 }
3654 MatEndDate.prototype.ngOnInit = function () {
3655 // Normally this happens automatically, but it seems to break if not added explicitly when all
3656 // of the criteria below are met:
3657 // 1) The class extends a TS mixin.
3658 // 2) The application is running in ViewEngine.
3659 // 3) The application is being transpiled through tsickle.
3660 // This can be removed once google3 is completely migrated to Ivy.
3661 _super.prototype.ngOnInit.call(this);
3662 };
3663 MatEndDate.prototype.ngDoCheck = function () {
3664 // Normally this happens automatically, but it seems to break if not added explicitly when all
3665 // of the criteria below are met:
3666 // 1) The class extends a TS mixin.
3667 // 2) The application is running in ViewEngine.
3668 // 3) The application is being transpiled through tsickle.
3669 // This can be removed once google3 is completely migrated to Ivy.
3670 _super.prototype.ngDoCheck.call(this);
3671 };
3672 MatEndDate.prototype._getValueFromModel = function (modelValue) {
3673 return modelValue.end;
3674 };
3675 MatEndDate.prototype._shouldHandleChangeEvent = function (change) {
3676 var _a;
3677 if (!_super.prototype._shouldHandleChangeEvent.call(this, change)) {
3678 return false;
3679 }
3680 else {
3681 return !((_a = change.oldValue) === null || _a === void 0 ? void 0 : _a.end) ? !!change.selection.end :
3682 !change.selection.end ||
3683 !!this._dateAdapter.compareDate(change.oldValue.end, change.selection.end);
3684 }
3685 };
3686 MatEndDate.prototype._assignValueToModel = function (value) {
3687 if (this._model) {
3688 var range = new DateRange(this._model.selection.start, value);
3689 this._model.updateSelection(range, this);
3690 }
3691 };
3692 MatEndDate.prototype._onKeydown = function (event) {
3693 // If the user is pressing backspace on an empty end input, move focus back to the start.
3694 if (event.keyCode === keycodes.BACKSPACE && !this._elementRef.nativeElement.value) {
3695 this._rangeInput._startInput.focus();
3696 }
3697 _super.prototype._onKeydown.call(this, event);
3698 };
3699 return MatEndDate;
3700 }(_MatDateRangeInputBase));
3701 MatEndDate.decorators = [
3702 { type: i0.Directive, args: [{
3703 selector: 'input[matEndDate]',
3704 host: {
3705 'class': 'mat-end-date mat-date-range-input-inner',
3706 '[disabled]': 'disabled',
3707 '(input)': '_onInput($event.target.value)',
3708 '(change)': '_onChange()',
3709 '(keydown)': '_onKeydown($event)',
3710 '[attr.aria-haspopup]': '_rangeInput.rangePicker ? "dialog" : null',
3711 '[attr.aria-owns]': '(_rangeInput.rangePicker?.opened && _rangeInput.rangePicker.id) || null',
3712 '[attr.min]': '_getMinDate() ? _dateAdapter.toIso8601(_getMinDate()) : null',
3713 '[attr.max]': '_getMaxDate() ? _dateAdapter.toIso8601(_getMaxDate()) : null',
3714 '(blur)': '_onBlur()',
3715 'type': 'text',
3716 },
3717 providers: [
3718 { provide: forms.NG_VALUE_ACCESSOR, useExisting: MatEndDate, multi: true },
3719 { provide: forms.NG_VALIDATORS, useExisting: MatEndDate, multi: true }
3720 ],
3721 // These need to be specified explicitly, because some tooling doesn't
3722 // seem to pick them up from the base class. See #20932.
3723 outputs: ['dateChange', 'dateInput'],
3724 inputs: ['errorStateMatcher']
3725 },] }
3726 ];
3727 MatEndDate.ctorParameters = function () { return [
3728 { type: undefined, decorators: [{ type: i0.Inject, args: [MAT_DATE_RANGE_INPUT_PARENT,] }] },
3729 { type: i0.ElementRef },
3730 { type: core.ErrorStateMatcher },
3731 { type: i0.Injector },
3732 { type: forms.NgForm, decorators: [{ type: i0.Optional }] },
3733 { type: forms.FormGroupDirective, decorators: [{ type: i0.Optional }] },
3734 { type: core.DateAdapter, decorators: [{ type: i0.Optional }] },
3735 { type: undefined, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [core.MAT_DATE_FORMATS,] }] }
3736 ]; };
3737
3738 /**
3739 * @license
3740 * Copyright Google LLC All Rights Reserved.
3741 *
3742 * Use of this source code is governed by an MIT-style license that can be
3743 * found in the LICENSE file at https://angular.io/license
3744 */
3745 var nextUniqueId = 0;
3746 var MatDateRangeInput = /** @class */ (function () {
3747 function MatDateRangeInput(_changeDetectorRef, _elementRef, control, _dateAdapter, _formField) {
3748 this._changeDetectorRef = _changeDetectorRef;
3749 this._elementRef = _elementRef;
3750 this._dateAdapter = _dateAdapter;
3751 this._formField = _formField;
3752 this._closedSubscription = rxjs.Subscription.EMPTY;
3753 /** Unique ID for the input. */
3754 this.id = "mat-date-range-input-" + nextUniqueId++;
3755 /** Whether the control is focused. */
3756 this.focused = false;
3757 /** Name of the form control. */
3758 this.controlType = 'mat-date-range-input';
3759 this._groupDisabled = false;
3760 /** Value for the `aria-describedby` attribute of the inputs. */
3761 this._ariaDescribedBy = null;
3762 /** Separator text to be shown between the inputs. */
3763 this.separator = '–';
3764 /** Start of the comparison range that should be shown in the calendar. */
3765 this.comparisonStart = null;
3766 /** End of the comparison range that should be shown in the calendar. */
3767 this.comparisonEnd = null;
3768 /** Emits when the input's state has changed. */
3769 this.stateChanges = new rxjs.Subject();
3770 if (!_dateAdapter && (typeof ngDevMode === 'undefined' || ngDevMode)) {
3771 throw createMissingDateImplError('DateAdapter');
3772 }
3773 // The datepicker module can be used both with MDC and non-MDC form fields. We have
3774 // to conditionally add the MDC input class so that the range picker looks correctly.
3775 if (_formField === null || _formField === void 0 ? void 0 : _formField._elementRef.nativeElement.classList.contains('mat-mdc-form-field')) {
3776 var classList = _elementRef.nativeElement.classList;
3777 classList.add('mat-mdc-input-element');
3778 classList.add('mat-mdc-form-field-input-control');
3779 }
3780 // TODO(crisbeto): remove `as any` after #18206 lands.
3781 this.ngControl = control;
3782 }
3783 Object.defineProperty(MatDateRangeInput.prototype, "value", {
3784 /** Current value of the range input. */
3785 get: function () {
3786 return this._model ? this._model.selection : null;
3787 },
3788 enumerable: false,
3789 configurable: true
3790 });
3791 Object.defineProperty(MatDateRangeInput.prototype, "shouldLabelFloat", {
3792 /** Whether the control's label should float. */
3793 get: function () {
3794 return this.focused || !this.empty;
3795 },
3796 enumerable: false,
3797 configurable: true
3798 });
3799 Object.defineProperty(MatDateRangeInput.prototype, "placeholder", {
3800 /**
3801 * Implemented as a part of `MatFormFieldControl`.
3802 * Set the placeholder attribute on `matStartDate` and `matEndDate`.
3803 * @docs-private
3804 */
3805 get: function () {
3806 var _a, _b;
3807 var start = ((_a = this._startInput) === null || _a === void 0 ? void 0 : _a._getPlaceholder()) || '';
3808 var end = ((_b = this._endInput) === null || _b === void 0 ? void 0 : _b._getPlaceholder()) || '';
3809 return (start || end) ? start + " " + this.separator + " " + end : '';
3810 },
3811 enumerable: false,
3812 configurable: true
3813 });
3814 Object.defineProperty(MatDateRangeInput.prototype, "rangePicker", {
3815 /** The range picker that this input is associated with. */
3816 get: function () { return this._rangePicker; },
3817 set: function (rangePicker) {
3818 var _this = this;
3819 if (rangePicker) {
3820 this._model = rangePicker.registerInput(this);
3821 this._rangePicker = rangePicker;
3822 this._closedSubscription.unsubscribe();
3823 this._closedSubscription = rangePicker.closedStream.subscribe(function () {
3824 var _a, _b;
3825 (_a = _this._startInput) === null || _a === void 0 ? void 0 : _a._onTouched();
3826 (_b = _this._endInput) === null || _b === void 0 ? void 0 : _b._onTouched();
3827 });
3828 this._registerModel(this._model);
3829 }
3830 },
3831 enumerable: false,
3832 configurable: true
3833 });
3834 Object.defineProperty(MatDateRangeInput.prototype, "required", {
3835 /** Whether the input is required. */
3836 get: function () { return !!this._required; },
3837 set: function (value) {
3838 this._required = coercion.coerceBooleanProperty(value);
3839 },
3840 enumerable: false,
3841 configurable: true
3842 });
3843 Object.defineProperty(MatDateRangeInput.prototype, "dateFilter", {
3844 /** Function that can be used to filter out dates within the date range picker. */
3845 get: function () { return this._dateFilter; },
3846 set: function (value) {
3847 var start = this._startInput;
3848 var end = this._endInput;
3849 var wasMatchingStart = start && start._matchesFilter(start.value);
3850 var wasMatchingEnd = end && end._matchesFilter(start.value);
3851 this._dateFilter = value;
3852 if (start && start._matchesFilter(start.value) !== wasMatchingStart) {
3853 start._validatorOnChange();
3854 }
3855 if (end && end._matchesFilter(end.value) !== wasMatchingEnd) {
3856 end._validatorOnChange();
3857 }
3858 },
3859 enumerable: false,
3860 configurable: true
3861 });
3862 Object.defineProperty(MatDateRangeInput.prototype, "min", {
3863 /** The minimum valid date. */
3864 get: function () { return this._min; },
3865 set: function (value) {
3866 var validValue = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
3867 if (!this._dateAdapter.sameDate(validValue, this._min)) {
3868 this._min = validValue;
3869 this._revalidate();
3870 }
3871 },
3872 enumerable: false,
3873 configurable: true
3874 });
3875 Object.defineProperty(MatDateRangeInput.prototype, "max", {
3876 /** The maximum valid date. */
3877 get: function () { return this._max; },
3878 set: function (value) {
3879 var validValue = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(value));
3880 if (!this._dateAdapter.sameDate(validValue, this._max)) {
3881 this._max = validValue;
3882 this._revalidate();
3883 }
3884 },
3885 enumerable: false,
3886 configurable: true
3887 });
3888 Object.defineProperty(MatDateRangeInput.prototype, "disabled", {
3889 /** Whether the input is disabled. */
3890 get: function () {
3891 return (this._startInput && this._endInput) ?
3892 (this._startInput.disabled && this._endInput.disabled) :
3893 this._groupDisabled;
3894 },
3895 set: function (value) {
3896 var newValue = coercion.coerceBooleanProperty(value);
3897 if (newValue !== this._groupDisabled) {
3898 this._groupDisabled = newValue;
3899 this.stateChanges.next(undefined);
3900 }
3901 },
3902 enumerable: false,
3903 configurable: true
3904 });
3905 Object.defineProperty(MatDateRangeInput.prototype, "errorState", {
3906 /** Whether the input is in an error state. */
3907 get: function () {
3908 if (this._startInput && this._endInput) {
3909 return this._startInput.errorState || this._endInput.errorState;
3910 }
3911 return false;
3912 },
3913 enumerable: false,
3914 configurable: true
3915 });
3916 Object.defineProperty(MatDateRangeInput.prototype, "empty", {
3917 /** Whether the datepicker input is empty. */
3918 get: function () {
3919 var startEmpty = this._startInput ? this._startInput.isEmpty() : false;
3920 var endEmpty = this._endInput ? this._endInput.isEmpty() : false;
3921 return startEmpty && endEmpty;
3922 },
3923 enumerable: false,
3924 configurable: true
3925 });
3926 /**
3927 * Implemented as a part of `MatFormFieldControl`.
3928 * @docs-private
3929 */
3930 MatDateRangeInput.prototype.setDescribedByIds = function (ids) {
3931 this._ariaDescribedBy = ids.length ? ids.join(' ') : null;
3932 };
3933 /**
3934 * Implemented as a part of `MatFormFieldControl`.
3935 * @docs-private
3936 */
3937 MatDateRangeInput.prototype.onContainerClick = function () {
3938 if (!this.focused && !this.disabled) {
3939 if (!this._model || !this._model.selection.start) {
3940 this._startInput.focus();
3941 }
3942 else {
3943 this._endInput.focus();
3944 }
3945 }
3946 };
3947 MatDateRangeInput.prototype.ngAfterContentInit = function () {
3948 var _this = this;
3949 if (typeof ngDevMode === 'undefined' || ngDevMode) {
3950 if (!this._startInput) {
3951 throw Error('mat-date-range-input must contain a matStartDate input');
3952 }
3953 if (!this._endInput) {
3954 throw Error('mat-date-range-input must contain a matEndDate input');
3955 }
3956 }
3957 if (this._model) {
3958 this._registerModel(this._model);
3959 }
3960 // We don't need to unsubscribe from this, because we
3961 // know that the input streams will be completed on destroy.
3962 rxjs.merge(this._startInput.stateChanges, this._endInput.stateChanges).subscribe(function () {
3963 _this.stateChanges.next(undefined);
3964 });
3965 };
3966 MatDateRangeInput.prototype.ngOnChanges = function (changes) {
3967 if (dateInputsHaveChanged(changes, this._dateAdapter)) {
3968 this.stateChanges.next(undefined);
3969 }
3970 };
3971 MatDateRangeInput.prototype.ngOnDestroy = function () {
3972 this._closedSubscription.unsubscribe();
3973 this.stateChanges.complete();
3974 };
3975 /** Gets the date at which the calendar should start. */
3976 MatDateRangeInput.prototype.getStartValue = function () {
3977 return this.value ? this.value.start : null;
3978 };
3979 /** Gets the input's theme palette. */
3980 MatDateRangeInput.prototype.getThemePalette = function () {
3981 return this._formField ? this._formField.color : undefined;
3982 };
3983 /** Gets the element to which the calendar overlay should be attached. */
3984 MatDateRangeInput.prototype.getConnectedOverlayOrigin = function () {
3985 return this._formField ? this._formField.getConnectedOverlayOrigin() : this._elementRef;
3986 };
3987 /** Gets the ID of an element that should be used a description for the calendar overlay. */
3988 MatDateRangeInput.prototype.getOverlayLabelId = function () {
3989 return this._formField ? this._formField.getLabelId() : null;
3990 };
3991 /** Gets the value that is used to mirror the state input. */
3992 MatDateRangeInput.prototype._getInputMirrorValue = function () {
3993 return this._startInput ? this._startInput.getMirrorValue() : '';
3994 };
3995 /** Whether the input placeholders should be hidden. */
3996 MatDateRangeInput.prototype._shouldHidePlaceholders = function () {
3997 return this._startInput ? !this._startInput.isEmpty() : false;
3998 };
3999 /** Handles the value in one of the child inputs changing. */
4000 MatDateRangeInput.prototype._handleChildValueChange = function () {
4001 this.stateChanges.next(undefined);
4002 this._changeDetectorRef.markForCheck();
4003 };
4004 /** Opens the date range picker associated with the input. */
4005 MatDateRangeInput.prototype._openDatepicker = function () {
4006 if (this._rangePicker) {
4007 this._rangePicker.open();
4008 }
4009 };
4010 /** Whether the separate text should be hidden. */
4011 MatDateRangeInput.prototype._shouldHideSeparator = function () {
4012 return (!this._formField || (this._formField.getLabelId() &&
4013 !this._formField._shouldLabelFloat())) && this.empty;
4014 };
4015 /** Gets the value for the `aria-labelledby` attribute of the inputs. */
4016 MatDateRangeInput.prototype._getAriaLabelledby = function () {
4017 var formField = this._formField;
4018 return formField && formField._hasFloatingLabel() ? formField._labelId : null;
4019 };
4020 /** Updates the focused state of the range input. */
4021 MatDateRangeInput.prototype._updateFocus = function (origin) {
4022 this.focused = origin !== null;
4023 this.stateChanges.next();
4024 };
4025 /** Re-runs the validators on the start/end inputs. */
4026 MatDateRangeInput.prototype._revalidate = function () {
4027 if (this._startInput) {
4028 this._startInput._validatorOnChange();
4029 }
4030 if (this._endInput) {
4031 this._endInput._validatorOnChange();
4032 }
4033 };
4034 /** Registers the current date selection model with the start/end inputs. */
4035 MatDateRangeInput.prototype._registerModel = function (model) {
4036 if (this._startInput) {
4037 this._startInput._registerModel(model);
4038 }
4039 if (this._endInput) {
4040 this._endInput._registerModel(model);
4041 }
4042 };
4043 return MatDateRangeInput;
4044 }());
4045 MatDateRangeInput.decorators = [
4046 { type: i0.Component, args: [{
4047 selector: 'mat-date-range-input',
4048 template: "<div\n class=\"mat-date-range-input-container\"\n cdkMonitorSubtreeFocus\n (cdkFocusChange)=\"_updateFocus($event)\">\n <div class=\"mat-date-range-input-start-wrapper\">\n <ng-content select=\"input[matStartDate]\"></ng-content>\n <span\n class=\"mat-date-range-input-mirror\"\n aria-hidden=\"true\">{{_getInputMirrorValue()}}</span>\n </div>\n\n <span\n class=\"mat-date-range-input-separator\"\n [class.mat-date-range-input-separator-hidden]=\"_shouldHideSeparator()\">{{separator}}</span>\n\n <div class=\"mat-date-range-input-end-wrapper\">\n <ng-content select=\"input[matEndDate]\"></ng-content>\n </div>\n</div>\n\n",
4049 exportAs: 'matDateRangeInput',
4050 host: {
4051 'class': 'mat-date-range-input',
4052 '[class.mat-date-range-input-hide-placeholders]': '_shouldHidePlaceholders()',
4053 '[class.mat-date-range-input-required]': 'required',
4054 '[attr.id]': 'null',
4055 'role': 'group',
4056 '[attr.aria-labelledby]': '_getAriaLabelledby()',
4057 '[attr.aria-describedby]': '_ariaDescribedBy',
4058 // Used by the test harness to tie this input to its calendar. We can't depend on
4059 // `aria-owns` for this, because it's only defined while the calendar is open.
4060 '[attr.data-mat-calendar]': 'rangePicker ? rangePicker.id : null',
4061 },
4062 changeDetection: i0.ChangeDetectionStrategy.OnPush,
4063 encapsulation: i0.ViewEncapsulation.None,
4064 providers: [
4065 { provide: formField.MatFormFieldControl, useExisting: MatDateRangeInput },
4066 { provide: MAT_DATE_RANGE_INPUT_PARENT, useExisting: MatDateRangeInput },
4067 ],
4068 styles: [".mat-date-range-input{display:block;width:100%}.mat-date-range-input-container{display:flex;align-items:center}.mat-date-range-input-separator{transition:opacity 400ms 133.3333333333ms cubic-bezier(0.25, 0.8, 0.25, 1);margin:0 4px}.mat-date-range-input-separator-hidden{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:0;transition:none}.mat-date-range-input-inner{font:inherit;background:transparent;color:currentColor;border:none;outline:none;padding:0;margin:0;vertical-align:bottom;text-align:inherit;-webkit-appearance:none;width:100%}.mat-date-range-input-inner::-ms-clear,.mat-date-range-input-inner::-ms-reveal{display:none}.mat-date-range-input-inner:-moz-ui-invalid{box-shadow:none}.mat-date-range-input-inner::placeholder{transition:color 400ms 133.3333333333ms cubic-bezier(0.25, 0.8, 0.25, 1)}.mat-date-range-input-inner::-moz-placeholder{transition:color 400ms 133.3333333333ms cubic-bezier(0.25, 0.8, 0.25, 1)}.mat-date-range-input-inner::-webkit-input-placeholder{transition:color 400ms 133.3333333333ms cubic-bezier(0.25, 0.8, 0.25, 1)}.mat-date-range-input-inner:-ms-input-placeholder{transition:color 400ms 133.3333333333ms cubic-bezier(0.25, 0.8, 0.25, 1)}.mat-form-field-hide-placeholder .mat-date-range-input-inner::placeholder,.mat-date-range-input-hide-placeholders .mat-date-range-input-inner::placeholder{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:transparent !important;-webkit-text-fill-color:transparent;transition:none}.cdk-high-contrast-active .mat-form-field-hide-placeholder .mat-date-range-input-inner::placeholder,.cdk-high-contrast-active .mat-date-range-input-hide-placeholders .mat-date-range-input-inner::placeholder{opacity:0}.mat-form-field-hide-placeholder .mat-date-range-input-inner::-moz-placeholder,.mat-date-range-input-hide-placeholders .mat-date-range-input-inner::-moz-placeholder{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:transparent !important;-webkit-text-fill-color:transparent;transition:none}.cdk-high-contrast-active .mat-form-field-hide-placeholder .mat-date-range-input-inner::-moz-placeholder,.cdk-high-contrast-active .mat-date-range-input-hide-placeholders .mat-date-range-input-inner::-moz-placeholder{opacity:0}.mat-form-field-hide-placeholder .mat-date-range-input-inner::-webkit-input-placeholder,.mat-date-range-input-hide-placeholders .mat-date-range-input-inner::-webkit-input-placeholder{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:transparent !important;-webkit-text-fill-color:transparent;transition:none}.cdk-high-contrast-active .mat-form-field-hide-placeholder .mat-date-range-input-inner::-webkit-input-placeholder,.cdk-high-contrast-active .mat-date-range-input-hide-placeholders .mat-date-range-input-inner::-webkit-input-placeholder{opacity:0}.mat-form-field-hide-placeholder .mat-date-range-input-inner:-ms-input-placeholder,.mat-date-range-input-hide-placeholders .mat-date-range-input-inner:-ms-input-placeholder{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;color:transparent !important;-webkit-text-fill-color:transparent;transition:none}.cdk-high-contrast-active .mat-form-field-hide-placeholder .mat-date-range-input-inner:-ms-input-placeholder,.cdk-high-contrast-active .mat-date-range-input-hide-placeholders .mat-date-range-input-inner:-ms-input-placeholder{opacity:0}.mat-date-range-input-mirror{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;visibility:hidden;white-space:nowrap;display:inline-block;min-width:2px}.mat-date-range-input-start-wrapper{position:relative;overflow:hidden;max-width:calc(50% - 4px)}.mat-date-range-input-start-wrapper .mat-date-range-input-inner{position:absolute;top:0;left:0}.mat-date-range-input-end-wrapper{flex-grow:1;max-width:calc(50% - 4px)}.mat-form-field-type-mat-date-range-input .mat-form-field-infix{width:200px}\n"]
4069 },] }
4070 ];
4071 MatDateRangeInput.ctorParameters = function () { return [
4072 { type: i0.ChangeDetectorRef },
4073 { type: i0.ElementRef },
4074 { type: forms.ControlContainer, decorators: [{ type: i0.Optional }, { type: i0.Self }] },
4075 { type: core.DateAdapter, decorators: [{ type: i0.Optional }] },
4076 { type: formField.MatFormField, decorators: [{ type: i0.Optional }, { type: i0.Inject, args: [formField.MAT_FORM_FIELD,] }] }
4077 ]; };
4078 MatDateRangeInput.propDecorators = {
4079 rangePicker: [{ type: i0.Input }],
4080 required: [{ type: i0.Input }],
4081 dateFilter: [{ type: i0.Input }],
4082 min: [{ type: i0.Input }],
4083 max: [{ type: i0.Input }],
4084 disabled: [{ type: i0.Input }],
4085 separator: [{ type: i0.Input }],
4086 comparisonStart: [{ type: i0.Input }],
4087 comparisonEnd: [{ type: i0.Input }],
4088 _startInput: [{ type: i0.ContentChild, args: [MatStartDate,] }],
4089 _endInput: [{ type: i0.ContentChild, args: [MatEndDate,] }]
4090 };
4091
4092 // TODO(mmalerba): We use a component instead of a directive here so the user can use implicit
4093 // template reference variables (e.g. #d vs #d="matDateRangePicker"). We can change this to a
4094 // directive if angular adds support for `exportAs: '$implicit'` on directives.
4095 /** Component responsible for managing the date range picker popup/dialog. */
4096 var MatDateRangePicker = /** @class */ (function (_super) {
4097 __extends(MatDateRangePicker, _super);
4098 function MatDateRangePicker() {
4099 return _super !== null && _super.apply(this, arguments) || this;
4100 }
4101 MatDateRangePicker.prototype._forwardContentValues = function (instance) {
4102 _super.prototype._forwardContentValues.call(this, instance);
4103 var input = this.datepickerInput;
4104 if (input) {
4105 instance.comparisonStart = input.comparisonStart;
4106 instance.comparisonEnd = input.comparisonEnd;
4107 }
4108 };
4109 return MatDateRangePicker;
4110 }(MatDatepickerBase));
4111 MatDateRangePicker.decorators = [
4112 { type: i0.Component, args: [{
4113 selector: 'mat-date-range-picker',
4114 template: '',
4115 exportAs: 'matDateRangePicker',
4116 changeDetection: i0.ChangeDetectionStrategy.OnPush,
4117 encapsulation: i0.ViewEncapsulation.None,
4118 providers: [
4119 MAT_RANGE_DATE_SELECTION_MODEL_PROVIDER,
4120 MAT_CALENDAR_RANGE_STRATEGY_PROVIDER,
4121 { provide: MatDatepickerBase, useExisting: MatDateRangePicker },
4122 ]
4123 },] }
4124 ];
4125
4126 /**
4127 * @license
4128 * Copyright Google LLC All Rights Reserved.
4129 *
4130 * Use of this source code is governed by an MIT-style license that can be
4131 * found in the LICENSE file at https://angular.io/license
4132 */
4133 /** Button that will close the datepicker and assign the current selection to the data model. */
4134 var MatDatepickerApply = /** @class */ (function () {
4135 function MatDatepickerApply(_datepicker) {
4136 this._datepicker = _datepicker;
4137 }
4138 MatDatepickerApply.prototype._applySelection = function () {
4139 this._datepicker._applyPendingSelection();
4140 this._datepicker.close();
4141 };
4142 return MatDatepickerApply;
4143 }());
4144 MatDatepickerApply.decorators = [
4145 { type: i0.Directive, args: [{
4146 selector: '[matDatepickerApply], [matDateRangePickerApply]',
4147 host: { '(click)': '_applySelection()' }
4148 },] }
4149 ];
4150 MatDatepickerApply.ctorParameters = function () { return [
4151 { type: MatDatepickerBase }
4152 ]; };
4153 /** Button that will close the datepicker and discard the current selection. */
4154 var MatDatepickerCancel = /** @class */ (function () {
4155 function MatDatepickerCancel(_datepicker) {
4156 this._datepicker = _datepicker;
4157 }
4158 return MatDatepickerCancel;
4159 }());
4160 MatDatepickerCancel.decorators = [
4161 { type: i0.Directive, args: [{
4162 selector: '[matDatepickerCancel], [matDateRangePickerCancel]',
4163 host: { '(click)': '_datepicker.close()' }
4164 },] }
4165 ];
4166 MatDatepickerCancel.ctorParameters = function () { return [
4167 { type: MatDatepickerBase }
4168 ]; };
4169 /**
4170 * Container that can be used to project a row of action buttons
4171 * to the bottom of a datepicker or date range picker.
4172 */
4173 var MatDatepickerActions = /** @class */ (function () {
4174 function MatDatepickerActions(_datepicker, _viewContainerRef) {
4175 this._datepicker = _datepicker;
4176 this._viewContainerRef = _viewContainerRef;
4177 }
4178 MatDatepickerActions.prototype.ngAfterViewInit = function () {
4179 this._portal = new portal.TemplatePortal(this._template, this._viewContainerRef);
4180 this._datepicker.registerActions(this._portal);
4181 };
4182 MatDatepickerActions.prototype.ngOnDestroy = function () {
4183 var _a;
4184 this._datepicker.removeActions(this._portal);
4185 // Needs to be null checked since we initialize it in `ngAfterViewInit`.
4186 if (this._portal && this._portal.isAttached) {
4187 (_a = this._portal) === null || _a === void 0 ? void 0 : _a.detach();
4188 }
4189 };
4190 return MatDatepickerActions;
4191 }());
4192 MatDatepickerActions.decorators = [
4193 { type: i0.Component, args: [{
4194 selector: 'mat-datepicker-actions, mat-date-range-picker-actions',
4195 template: "\n <ng-template>\n <div class=\"mat-datepicker-actions\">\n <ng-content></ng-content>\n </div>\n </ng-template>\n ",
4196 changeDetection: i0.ChangeDetectionStrategy.OnPush,
4197 encapsulation: i0.ViewEncapsulation.None,
4198 styles: [".mat-datepicker-actions{display:flex;justify-content:flex-end;align-items:center;padding:0 8px 8px 8px}.mat-datepicker-actions .mat-button-base+.mat-button-base{margin-left:8px}[dir=rtl] .mat-datepicker-actions .mat-button-base+.mat-button-base{margin-left:0;margin-right:8px}\n"]
4199 },] }
4200 ];
4201 MatDatepickerActions.ctorParameters = function () { return [
4202 { type: MatDatepickerBase },
4203 { type: i0.ViewContainerRef }
4204 ]; };
4205 MatDatepickerActions.propDecorators = {
4206 _template: [{ type: i0.ViewChild, args: [i0.TemplateRef,] }]
4207 };
4208
4209 /**
4210 * @license
4211 * Copyright Google LLC All Rights Reserved.
4212 *
4213 * Use of this source code is governed by an MIT-style license that can be
4214 * found in the LICENSE file at https://angular.io/license
4215 */
4216 var MatDatepickerModule = /** @class */ (function () {
4217 function MatDatepickerModule() {
4218 }
4219 return MatDatepickerModule;
4220 }());
4221 MatDatepickerModule.decorators = [
4222 { type: i0.NgModule, args: [{
4223 imports: [
4224 common.CommonModule,
4225 button.MatButtonModule,
4226 overlay.OverlayModule,
4227 a11y.A11yModule,
4228 portal.PortalModule,
4229 core.MatCommonModule,
4230 ],
4231 exports: [
4232 scrolling.CdkScrollableModule,
4233 MatCalendar,
4234 MatCalendarBody,
4235 MatDatepicker,
4236 MatDatepickerContent,
4237 MatDatepickerInput,
4238 MatDatepickerToggle,
4239 MatDatepickerToggleIcon,
4240 MatMonthView,
4241 MatYearView,
4242 MatMultiYearView,
4243 MatCalendarHeader,
4244 MatDateRangeInput,
4245 MatStartDate,
4246 MatEndDate,
4247 MatDateRangePicker,
4248 MatDatepickerActions,
4249 MatDatepickerCancel,
4250 MatDatepickerApply
4251 ],
4252 declarations: [
4253 MatCalendar,
4254 MatCalendarBody,
4255 MatDatepicker,
4256 MatDatepickerContent,
4257 MatDatepickerInput,
4258 MatDatepickerToggle,
4259 MatDatepickerToggleIcon,
4260 MatMonthView,
4261 MatYearView,
4262 MatMultiYearView,
4263 MatCalendarHeader,
4264 MatDateRangeInput,
4265 MatStartDate,
4266 MatEndDate,
4267 MatDateRangePicker,
4268 MatDatepickerActions,
4269 MatDatepickerCancel,
4270 MatDatepickerApply
4271 ],
4272 providers: [
4273 MatDatepickerIntl,
4274 MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER
4275 ],
4276 entryComponents: [
4277 MatDatepickerContent,
4278 MatCalendarHeader,
4279 ]
4280 },] }
4281 ];
4282
4283 /**
4284 * @license
4285 * Copyright Google LLC All Rights Reserved.
4286 *
4287 * Use of this source code is governed by an MIT-style license that can be
4288 * found in the LICENSE file at https://angular.io/license
4289 */
4290
4291 /**
4292 * Generated bundle index. Do not edit.
4293 */
4294
4295 exports.DateRange = DateRange;
4296 exports.DefaultMatCalendarRangeStrategy = DefaultMatCalendarRangeStrategy;
4297 exports.MAT_DATEPICKER_SCROLL_STRATEGY = MAT_DATEPICKER_SCROLL_STRATEGY;
4298 exports.MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY = MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY;
4299 exports.MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER = MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER;
4300 exports.MAT_DATEPICKER_VALIDATORS = MAT_DATEPICKER_VALIDATORS;
4301 exports.MAT_DATEPICKER_VALUE_ACCESSOR = MAT_DATEPICKER_VALUE_ACCESSOR;
4302 exports.MAT_DATE_RANGE_SELECTION_STRATEGY = MAT_DATE_RANGE_SELECTION_STRATEGY;
4303 exports.MAT_RANGE_DATE_SELECTION_MODEL_FACTORY = MAT_RANGE_DATE_SELECTION_MODEL_FACTORY;
4304 exports.MAT_RANGE_DATE_SELECTION_MODEL_PROVIDER = MAT_RANGE_DATE_SELECTION_MODEL_PROVIDER;
4305 exports.MAT_SINGLE_DATE_SELECTION_MODEL_FACTORY = MAT_SINGLE_DATE_SELECTION_MODEL_FACTORY;
4306 exports.MAT_SINGLE_DATE_SELECTION_MODEL_PROVIDER = MAT_SINGLE_DATE_SELECTION_MODEL_PROVIDER;
4307 exports.MatCalendar = MatCalendar;
4308 exports.MatCalendarBody = MatCalendarBody;
4309 exports.MatCalendarCell = MatCalendarCell;
4310 exports.MatCalendarHeader = MatCalendarHeader;
4311 exports.MatDateRangeInput = MatDateRangeInput;
4312 exports.MatDateRangePicker = MatDateRangePicker;
4313 exports.MatDateSelectionModel = MatDateSelectionModel;
4314 exports.MatDatepicker = MatDatepicker;
4315 exports.MatDatepickerActions = MatDatepickerActions;
4316 exports.MatDatepickerApply = MatDatepickerApply;
4317 exports.MatDatepickerCancel = MatDatepickerCancel;
4318 exports.MatDatepickerContent = MatDatepickerContent;
4319 exports.MatDatepickerInput = MatDatepickerInput;
4320 exports.MatDatepickerInputEvent = MatDatepickerInputEvent;
4321 exports.MatDatepickerIntl = MatDatepickerIntl;
4322 exports.MatDatepickerModule = MatDatepickerModule;
4323 exports.MatDatepickerToggle = MatDatepickerToggle;
4324 exports.MatDatepickerToggleIcon = MatDatepickerToggleIcon;
4325 exports.MatEndDate = MatEndDate;
4326 exports.MatMonthView = MatMonthView;
4327 exports.MatMultiYearView = MatMultiYearView;
4328 exports.MatRangeDateSelectionModel = MatRangeDateSelectionModel;
4329 exports.MatSingleDateSelectionModel = MatSingleDateSelectionModel;
4330 exports.MatStartDate = MatStartDate;
4331 exports.MatYearView = MatYearView;
4332 exports.matDatepickerAnimations = matDatepickerAnimations;
4333 exports.yearsPerPage = yearsPerPage;
4334 exports.yearsPerRow = yearsPerRow;
4335 exports.ɵangular_material_src_material_datepicker_datepicker_a = MAT_CALENDAR_RANGE_STRATEGY_PROVIDER_FACTORY;
4336 exports.ɵangular_material_src_material_datepicker_datepicker_b = MAT_CALENDAR_RANGE_STRATEGY_PROVIDER;
4337 exports.ɵangular_material_src_material_datepicker_datepicker_c = MatDatepickerBase;
4338 exports.ɵangular_material_src_material_datepicker_datepicker_d = MatDatepickerInputBase;
4339 exports.ɵangular_material_src_material_datepicker_datepicker_e = MAT_DATE_RANGE_INPUT_PARENT;
4340
4341 Object.defineProperty(exports, '__esModule', { value: true });
4342
4343})));
4344//# sourceMappingURL=material-datepicker.umd.js.map
Note: See TracBrowser for help on using the repository browser.