@angular/material 7.1.0 → 7.2.2

package/bundles/material-datepicker.umd.js

@@ -42,7 +42,7 @@ function __extends(d, b) {
 
 /**
  * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
+ * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 
 /**
@@ -58,7 +58,7 @@ function createMissingDateImplError(provider) {
 
 /**
  * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
+ * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 /**
  * Datepicker data that requires internationalization.
@@ -120,7 +120,7 @@ var MatDatepickerIntl = /** @class */ (function () {
 
 /**
  * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
+ * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 /**
  * An internal class that represents the data corresponding to a single calendar cell.
@@ -189,12 +189,12 @@ var MatCalendarBody = /** @class */ (function () {
      */
     function (changes) {
         /** @type {?} */
-        var columnChanges = changes["numCols"];
+        var columnChanges = changes.numCols;
         var _a = this, rows = _a.rows, numCols = _a.numCols;
-        if (changes["rows"] || columnChanges) {
+        if (changes.rows || columnChanges) {
             this._firstRowOffset = rows && rows.length && rows[0].length ? numCols - rows[0].length : 0;
         }
-        if (changes["cellAspectRatio"] || columnChanges || !this._cellPadding) {
+        if (changes.cellAspectRatio || columnChanges || !this._cellPadding) {
             this._cellPadding = 50 * this.cellAspectRatio / numCols + "%";
         }
         if (columnChanges || !this._cellWidth) {
@@ -244,7 +244,7 @@ var MatCalendarBody = /** @class */ (function () {
     MatCalendarBody.decorators = [
         { type: core.Component, args: [{selector: '[mat-calendar-body]',
                     template: "<tr *ngIf=\"_firstRowOffset < labelMinRequiredCells\" aria-hidden=\"true\"><td class=\"mat-calendar-body-label\" [attr.colspan]=\"numCols\" [style.paddingTop]=\"_cellPadding\" [style.paddingBottom]=\"_cellPadding\">{{label}}</td></tr><tr *ngFor=\"let row of rows; let rowIndex = index\" role=\"row\"><td *ngIf=\"rowIndex === 0 && _firstRowOffset\" aria-hidden=\"true\" class=\"mat-calendar-body-label\" [attr.colspan]=\"_firstRowOffset\" [style.paddingTop]=\"_cellPadding\" [style.paddingBottom]=\"_cellPadding\">{{_firstRowOffset >= labelMinRequiredCells ? label : ''}}</td><td *ngFor=\"let item of row; let colIndex = index\" role=\"gridcell\" class=\"mat-calendar-body-cell\" [ngClass]=\"item.cssClasses\" [tabindex]=\"_isActiveCell(rowIndex, colIndex) ? 0 : -1\" [class.mat-calendar-body-disabled]=\"!item.enabled\" [class.mat-calendar-body-active]=\"_isActiveCell(rowIndex, colIndex)\" [attr.aria-label]=\"item.ariaLabel\" [attr.aria-disabled]=\"!item.enabled || null\" [attr.aria-selected]=\"selectedValue === item.value\" (click)=\"_cellClicked(item)\" [style.width]=\"_cellWidth\" [style.paddingTop]=\"_cellPadding\" [style.paddingBottom]=\"_cellPadding\"><div class=\"mat-calendar-body-cell-content\" [class.mat-calendar-body-selected]=\"selectedValue === item.value\" [class.mat-calendar-body-today]=\"todayValue === item.value\">{{item.displayValue}}</div></td></tr>",
-                    styles: [".mat-calendar-body{min-width:224px}.mat-calendar-body-label{height:0;line-height:0;text-align:left;padding-left:4.71429%;padding-right:4.71429%}.mat-calendar-body-cell{position:relative;height:0;line-height:0;text-align:center;outline:0;cursor:pointer}.mat-calendar-body-disabled{cursor:default}.mat-calendar-body-cell-content{position:absolute;top:5%;left:5%;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:90%;height:90%;line-height:1;border-width:1px;border-style:solid;border-radius:999px}@media screen and (-ms-high-contrast:active){.mat-calendar-body-cell-content{border:none}}@media screen and (-ms-high-contrast:active){.mat-calendar-body-selected,.mat-datepicker-popup:not(:empty){outline:solid 1px}.mat-calendar-body-today{outline:dotted 1px}}[dir=rtl] .mat-calendar-body-label{text-align:right}"],
+                    styles: [".mat-calendar-body{min-width:224px}.mat-calendar-body-label{height:0;line-height:0;text-align:left;padding-left:4.71429%;padding-right:4.71429%}.mat-calendar-body-cell{position:relative;height:0;line-height:0;text-align:center;outline:0;cursor:pointer}.mat-calendar-body-disabled{cursor:default}.mat-calendar-body-cell-content{position:absolute;top:5%;left:5%;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:90%;height:90%;line-height:1;border-width:1px;border-style:solid;border-radius:999px}@media (-ms-high-contrast:active){.mat-calendar-body-cell-content{border:none}}@media (-ms-high-contrast:active){.mat-calendar-body-selected,.mat-datepicker-popup:not(:empty){outline:solid 1px}.mat-calendar-body-today{outline:dotted 1px}}[dir=rtl] .mat-calendar-body-label{text-align:right}"],
                     host: {
                         'class': 'mat-calendar-body',
                         'role': 'grid',
@@ -276,7 +276,7 @@ var MatCalendarBody = /** @class */ (function () {
 
 /**
  * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
+ * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 /** @type {?} */
 var DAYS_PER_WEEK = 7;
@@ -315,6 +315,7 @@ var MatMonthView = /** @class */ (function () {
         var narrowWeekdays = this._dateAdapter.getDayOfWeekNames('narrow');
         /** @type {?} */
         var longWeekdays = this._dateAdapter.getDayOfWeekNames('long');
+        // Rotate the labels for days of the week based on the configured first day of the week.
         /** @type {?} */
         var weekdays = longWeekdays.map(function (long, i) {
             return { long: long, narrow: narrowWeekdays[i] };
@@ -444,6 +445,12 @@ var MatMonthView = /** @class */ (function () {
      * @return {?}
      */
     function (event) {
+        // TODO(mmalerba): We currently allow keyboard navigation to disabled dates, but just prevent
+        // disabled ones from being selected. This may not be ideal, we should look into whether
+        // navigation should skip over disabled dates, and if so, how to implement that efficiently.
+        // TODO(mmalerba): We currently allow keyboard navigation to disabled dates, but just prevent
+        // disabled ones from being selected. This may not be ideal, we should look into whether
+        // navigation should skip over disabled dates, and if so, how to implement that efficiently.
         /** @type {?} */
         var oldActiveDate = this._activeDate;
         /** @type {?} */
@@ -533,12 +540,15 @@ var MatMonthView = /** @class */ (function () {
     function () {
         this._matCalendarBody._focusActiveCell();
     };
+    /** Creates MatCalendarCells for the dates in this month. */
     /**
      * Creates MatCalendarCells for the dates in this month.
+     * @private
      * @return {?}
      */
     MatMonthView.prototype._createWeekCells = /**
      * Creates MatCalendarCells for the dates in this month.
+     * @private
      * @return {?}
      */
     function () {
@@ -564,13 +574,16 @@ var MatMonthView = /** @class */ (function () {
                 .push(new MatCalendarCell(i + 1, dateNames[i], ariaLabel, enabled, cellClasses));
         }
     };
+    /** Date filter for the month */
     /**
      * Date filter for the month
+     * @private
      * @param {?} date
      * @return {?}
      */
     MatMonthView.prototype._shouldEnableDate = /**
      * Date filter for the month
+     * @private
      * @param {?} date
      * @return {?}
      */
@@ -583,12 +596,18 @@ var MatMonthView = /** @class */ (function () {
     /**
      * Gets the date in this month that the given Date falls on.
      * Returns null if the given Date is in another month.
+     */
+    /**
+     * Gets the date in this month that the given Date falls on.
+     * Returns null if the given Date is in another month.
+     * @private
      * @param {?} date
      * @return {?}
      */
     MatMonthView.prototype._getDateInCurrentMonth = /**
      * Gets the date in this month that the given Date falls on.
      * Returns null if the given Date is in another month.
+     * @private
      * @param {?} date
      * @return {?}
      */
@@ -596,14 +615,17 @@ var MatMonthView = /** @class */ (function () {
         return date && this._hasSameMonthAndYear(date, this.activeDate) ?
             this._dateAdapter.getDate(date) : null;
     };
+    /** Checks whether the 2 dates are non-null and fall within the same month of the same year. */
     /**
      * Checks whether the 2 dates are non-null and fall within the same month of the same year.
+     * @private
      * @param {?} d1
      * @param {?} d2
      * @return {?}
      */
     MatMonthView.prototype._hasSameMonthAndYear = /**
      * Checks whether the 2 dates are non-null and fall within the same month of the same year.
+     * @private
      * @param {?} d1
      * @param {?} d2
      * @return {?}
@@ -613,22 +635,31 @@ var MatMonthView = /** @class */ (function () {
             this._dateAdapter.getYear(d1) == this._dateAdapter.getYear(d2));
     };
     /**
+     * @param obj The object to check.
+     * @returns The given object if it is both a date instance and valid, otherwise null.
+     */
+    /**
+     * @private
      * @param {?} obj The object to check.
      * @return {?} The given object if it is both a date instance and valid, otherwise null.
      */
     MatMonthView.prototype._getValidDateOrNull = /**
+     * @private
      * @param {?} obj The object to check.
      * @return {?} The given object if it is both a date instance and valid, otherwise null.
      */
     function (obj) {
         return (this._dateAdapter.isDateInstance(obj) && this._dateAdapter.isValid(obj)) ? obj : null;
     };
+    /** Determines whether the user has the RTL layout direction. */
     /**
      * Determines whether the user has the RTL layout direction.
+     * @private
      * @return {?}
      */
     MatMonthView.prototype._isRtl = /**
      * Determines whether the user has the RTL layout direction.
+     * @private
      * @return {?}
      */
     function () {
@@ -666,7 +697,7 @@ var MatMonthView = /** @class */ (function () {
 
 /**
  * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
+ * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 /** @type {?} */
 var yearsPerPage = 24;
@@ -842,6 +873,12 @@ var MatMultiYearView = /** @class */ (function () {
      * @return {?}
      */
     function (event) {
+        // TODO(mmalerba): We currently allow keyboard navigation to disabled dates, but just prevent
+        // disabled ones from being selected. This may not be ideal, we should look into whether
+        // navigation should skip over disabled dates, and if so, how to implement that efficiently.
+        // TODO(mmalerba): We currently allow keyboard navigation to disabled dates, but just prevent
+        // disabled ones from being selected. This may not be ideal, we should look into whether
+        // navigation should skip over disabled dates, and if so, how to implement that efficiently.
         /** @type {?} */
         var oldActiveDate = this._activeDate;
         /** @type {?} */
@@ -909,13 +946,16 @@ var MatMultiYearView = /** @class */ (function () {
     function () {
         this._matCalendarBody._focusActiveCell();
     };
+    /** Creates an MatCalendarCell for the given year. */
     /**
      * Creates an MatCalendarCell for the given year.
+     * @private
      * @param {?} year
      * @return {?}
      */
     MatMultiYearView.prototype._createCellForYear = /**
      * Creates an MatCalendarCell for the given year.
+     * @private
      * @param {?} year
      * @return {?}
      */
@@ -924,13 +964,16 @@ var MatMultiYearView = /** @class */ (function () {
         var yearName = this._dateAdapter.getYearName(this._dateAdapter.createDate(year, 0, 1));
         return new MatCalendarCell(year, yearName, yearName, this._shouldEnableYear(year));
     };
+    /** Whether the given year is enabled. */
     /**
      * Whether the given year is enabled.
+     * @private
      * @param {?} year
      * @return {?}
      */
     MatMultiYearView.prototype._shouldEnableYear = /**
      * Whether the given year is enabled.
+     * @private
      * @param {?} year
      * @return {?}
      */
@@ -956,22 +999,31 @@ var MatMultiYearView = /** @class */ (function () {
         return false;
     };
     /**
+     * @param obj The object to check.
+     * @returns The given object if it is both a date instance and valid, otherwise null.
+     */
+    /**
+     * @private
      * @param {?} obj The object to check.
      * @return {?} The given object if it is both a date instance and valid, otherwise null.
      */
     MatMultiYearView.prototype._getValidDateOrNull = /**
+     * @private
      * @param {?} obj The object to check.
      * @return {?} The given object if it is both a date instance and valid, otherwise null.
      */
     function (obj) {
         return (this._dateAdapter.isDateInstance(obj) && this._dateAdapter.isValid(obj)) ? obj : null;
     };
+    /** Determines whether the user has the RTL layout direction. */
     /**
      * Determines whether the user has the RTL layout direction.
+     * @private
      * @return {?}
      */
     MatMultiYearView.prototype._isRtl = /**
      * Determines whether the user has the RTL layout direction.
+     * @private
      * @return {?}
      */
     function () {
@@ -1007,7 +1059,7 @@ var MatMultiYearView = /** @class */ (function () {
 
 /**
  * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
+ * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 /**
  * An internal component used to display a single year in the datepicker.
@@ -1156,6 +1208,12 @@ var MatYearView = /** @class */ (function () {
      * @return {?}
      */
     function (event) {
+        // TODO(mmalerba): We currently allow keyboard navigation to disabled dates, but just prevent
+        // disabled ones from being selected. This may not be ideal, we should look into whether
+        // navigation should skip over disabled dates, and if so, how to implement that efficiently.
+        // TODO(mmalerba): We currently allow keyboard navigation to disabled dates, but just prevent
+        // disabled ones from being selected. This may not be ideal, we should look into whether
+        // navigation should skip over disabled dates, and if so, how to implement that efficiently.
         /** @type {?} */
         var oldActiveDate = this._activeDate;
         /** @type {?} */
@@ -1237,12 +1295,18 @@ var MatYearView = /** @class */ (function () {
     /**
      * Gets the month in this year that the given Date falls on.
      * Returns null if the given Date is in another year.
+     */
+    /**
+     * Gets the month in this year that the given Date falls on.
+     * Returns null if the given Date is in another year.
+     * @private
      * @param {?} date
      * @return {?}
      */
     MatYearView.prototype._getMonthInCurrentYear = /**
      * Gets the month in this year that the given Date falls on.
      * Returns null if the given Date is in another year.
+     * @private
      * @param {?} date
      * @return {?}
      */
@@ -1250,14 +1314,17 @@ var MatYearView = /** @class */ (function () {
         return date && this._dateAdapter.getYear(date) == this._dateAdapter.getYear(this.activeDate) ?
             this._dateAdapter.getMonth(date) : null;
     };
+    /** Creates an MatCalendarCell for the given month. */
     /**
      * Creates an MatCalendarCell for the given month.
+     * @private
      * @param {?} month
      * @param {?} monthName
      * @return {?}
      */
     MatYearView.prototype._createCellForMonth = /**
      * Creates an MatCalendarCell for the given month.
+     * @private
      * @param {?} month
      * @param {?} monthName
      * @return {?}
@@ -1267,13 +1334,16 @@ var MatYearView = /** @class */ (function () {
         var ariaLabel = this._dateAdapter.format(this._dateAdapter.createDate(this._dateAdapter.getYear(this.activeDate), month, 1), this._dateFormats.display.monthYearA11yLabel);
         return new MatCalendarCell(month, monthName.toLocaleUpperCase(), ariaLabel, this._shouldEnableMonth(month));
     };
+    /** Whether the given month is enabled. */
     /**
      * Whether the given month is enabled.
+     * @private
      * @param {?} month
      * @return {?}
      */
     MatYearView.prototype._shouldEnableMonth = /**
      * Whether the given month is enabled.
+     * @private
      * @param {?} month
      * @return {?}
      */
@@ -1301,6 +1371,11 @@ var MatYearView = /** @class */ (function () {
     /**
      * Tests whether the combination month/year is after this.maxDate, considering
      * just the month and year of this.maxDate
+     */
+    /**
+     * Tests whether the combination month/year is after this.maxDate, considering
+     * just the month and year of this.maxDate
+     * @private
      * @param {?} year
      * @param {?} month
      * @return {?}
@@ -1308,6 +1383,7 @@ var MatYearView = /** @class */ (function () {
     MatYearView.prototype._isYearAndMonthAfterMaxDate = /**
      * Tests whether the combination month/year is after this.maxDate, considering
      * just the month and year of this.maxDate
+     * @private
      * @param {?} year
      * @param {?} month
      * @return {?}
@@ -1325,6 +1401,11 @@ var MatYearView = /** @class */ (function () {
     /**
      * Tests whether the combination month/year is before this.minDate, considering
      * just the month and year of this.minDate
+     */
+    /**
+     * Tests whether the combination month/year is before this.minDate, considering
+     * just the month and year of this.minDate
+     * @private
      * @param {?} year
      * @param {?} month
      * @return {?}
@@ -1332,6 +1413,7 @@ var MatYearView = /** @class */ (function () {
     MatYearView.prototype._isYearAndMonthBeforeMinDate = /**
      * Tests whether the combination month/year is before this.minDate, considering
      * just the month and year of this.minDate
+     * @private
      * @param {?} year
      * @param {?} month
      * @return {?}
@@ -1347,22 +1429,31 @@ var MatYearView = /** @class */ (function () {
         return false;
     };
     /**
+     * @param obj The object to check.
+     * @returns The given object if it is both a date instance and valid, otherwise null.
+     */
+    /**
+     * @private
      * @param {?} obj The object to check.
      * @return {?} The given object if it is both a date instance and valid, otherwise null.
      */
     MatYearView.prototype._getValidDateOrNull = /**
+     * @private
      * @param {?} obj The object to check.
      * @return {?} The given object if it is both a date instance and valid, otherwise null.
      */
     function (obj) {
         return (this._dateAdapter.isDateInstance(obj) && this._dateAdapter.isValid(obj)) ? obj : null;
     };
+    /** Determines whether the user has the RTL layout direction. */
     /**
      * Determines whether the user has the RTL layout direction.
+     * @private
      * @return {?}
      */
     MatYearView.prototype._isRtl = /**
      * Determines whether the user has the RTL layout direction.
+     * @private
      * @return {?}
      */
     function () {
@@ -1399,7 +1490,7 @@ var MatYearView = /** @class */ (function () {
 
 /**
  * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
+ * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 /**
  * Default header for MatCalendar
@@ -1451,9 +1542,9 @@ var MatCalendarHeader = /** @class */ (function () {
         configurable: true
     });
     Object.defineProperty(MatCalendarHeader.prototype, "prevButtonLabel", {
-        /** The label for the the previous button. */
+        /** The label for the previous button. */
         get: /**
-         * The label for the the previous button.
+         * The label for the previous button.
          * @return {?}
          */
         function () {
@@ -1467,9 +1558,9 @@ var MatCalendarHeader = /** @class */ (function () {
         configurable: true
     });
     Object.defineProperty(MatCalendarHeader.prototype, "nextButtonLabel", {
-        /** The label for the the next button. */
+        /** The label for the next button. */
         get: /**
-         * The label for the the next button.
+         * The label for the next button.
          * @return {?}
          */
         function () {
@@ -1551,14 +1642,17 @@ var MatCalendarHeader = /** @class */ (function () {
         return !this.calendar.maxDate ||
             !this._isSameView(this.calendar.activeDate, this.calendar.maxDate);
     };
+    /** Whether the two dates represent the same view in the current view mode (month or year). */
     /**
      * Whether the two dates represent the same view in the current view mode (month or year).
+     * @private
      * @param {?} date1
      * @param {?} date2
      * @return {?}
      */
     MatCalendarHeader.prototype._isSameView = /**
      * Whether the two dates represent the same view in the current view mode (month or year).
+     * @private
      * @param {?} date1
      * @param {?} date2
      * @return {?}
@@ -1799,7 +1893,7 @@ var MatCalendar = /** @class */ (function () {
      */
     function (changes) {
         /** @type {?} */
-        var change = changes["minDate"] || changes["maxDate"] || changes["dateFilter"];
+        var change = changes.minDate || changes.maxDate || changes.dateFilter;
         if (change && !change.firstChange) {
             /** @type {?} */
             var view = this._getCurrentViewComponent();
@@ -1907,22 +2001,31 @@ var MatCalendar = /** @class */ (function () {
         this.currentView = view;
     };
     /**
+     * @param obj The object to check.
+     * @returns The given object if it is both a date instance and valid, otherwise null.
+     */
+    /**
+     * @private
      * @param {?} obj The object to check.
      * @return {?} The given object if it is both a date instance and valid, otherwise null.
      */
     MatCalendar.prototype._getValidDateOrNull = /**
+     * @private
      * @param {?} obj The object to check.
      * @return {?} The given object if it is both a date instance and valid, otherwise null.
      */
     function (obj) {
         return (this._dateAdapter.isDateInstance(obj) && this._dateAdapter.isValid(obj)) ? obj : null;
     };
+    /** Returns the component instance that corresponds to the current calendar view. */
     /**
      * Returns the component instance that corresponds to the current calendar view.
+     * @private
      * @return {?}
      */
     MatCalendar.prototype._getCurrentViewComponent = /**
      * Returns the component instance that corresponds to the current calendar view.
+     * @private
      * @return {?}
      */
     function () {
@@ -1969,14 +2072,17 @@ var MatCalendar = /** @class */ (function () {
 
 /**
  * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
+ * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
-/** *
+/**
  * Animations used by the Material datepicker.
  * \@docs-private
-  @type {?} */
+ * @type {?}
+ */
 var matDatepickerAnimations = {
-    /** Transforms the height of the datepicker's calendar. */
+    /**
+     * Transforms the height of the datepicker's calendar.
+     */
     transformPanel: animations.trigger('transformPanel', [
         animations.state('void', animations.style({
             opacity: 0,
@@ -1988,7 +2094,9 @@ var matDatepickerAnimations = {
         }))),
         animations.transition('* => void', animations.animate('100ms linear', animations.style({ opacity: 0 })))
     ]),
-    /** Fades in the content of the calendar. */
+    /**
+     * Fades in the content of the calendar.
+     */
     fadeInCalendar: animations.trigger('fadeInCalendar', [
         animations.state('void', animations.style({ opacity: 0 })),
         animations.state('enter', animations.style({ opacity: 1 })),
@@ -2000,15 +2108,17 @@ var matDatepickerAnimations = {
 
 /**
  * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
+ * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
-/** *
+/**
  * Used to generate a unique ID for each datepicker instance.
-  @type {?} */
+ * @type {?}
+ */
 var datepickerUid = 0;
-/** *
+/**
  * Injection token that determines the scroll handling while the calendar is open.
-  @type {?} */
+ * @type {?}
+ */
 var MAT_DATEPICKER_SCROLL_STRATEGY = new core.InjectionToken('mat-datepicker-scroll-strategy');
 /**
  * \@docs-private
@@ -2018,18 +2128,22 @@ var MAT_DATEPICKER_SCROLL_STRATEGY = new core.InjectionToken('mat-datepicker-scr
 function MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY(overlay$$1) {
     return function () { return overlay$$1.scrollStrategies.reposition(); };
 }
-/** *
+/**
  * \@docs-private
-  @type {?} */
+ * @type {?}
+ */
 var MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY_PROVIDER = {
     provide: MAT_DATEPICKER_SCROLL_STRATEGY,
     deps: [overlay.Overlay],
     useFactory: MAT_DATEPICKER_SCROLL_STRATEGY_FACTORY,
 };
+// Boilerplate for applying mixins to MatDatepickerContent.
 /**
  * \@docs-private
  */
-var   /**
+var   
+// Boilerplate for applying mixins to MatDatepickerContent.
+/**
  * \@docs-private
  */
 MatDatepickerContentBase = /** @class */ (function () {
@@ -2090,6 +2204,9 @@ var MatDatepickerContent = /** @class */ (function (_super) {
     };
     return MatDatepickerContent;
 }(_MatDatepickerContentMixinBase));
+// TODO(mmalerba): We use a component instead of a directive here so the user can use implicit
+// template reference variables (e.g. #d vs #d="matDatepicker"). We can change this to a directive
+// if angular adds support for `exportAs: '$implicit'` on directives.
 /**
  * Component responsible for managing the datepicker popup/dialog.
  * @template D
@@ -2460,12 +2577,15 @@ var MatDatepicker = /** @class */ (function () {
             completeClose();
         }
     };
+    /** Open the calendar as a dialog. */
     /**
      * Open the calendar as a dialog.
+     * @private
      * @return {?}
      */
     MatDatepicker.prototype._openAsDialog = /**
      * Open the calendar as a dialog.
+     * @private
      * @return {?}
      */
     function () {
@@ -2486,12 +2606,15 @@ var MatDatepicker = /** @class */ (function () {
         this._dialogRef.componentInstance.datepicker = this;
         this._setColor();
     };
+    /** Open the calendar as a popup. */
     /**
      * Open the calendar as a popup.
+     * @private
      * @return {?}
      */
     MatDatepicker.prototype._openAsPopup = /**
      * Open the calendar as a popup.
+     * @private
      * @return {?}
      */
     function () {
@@ -2512,12 +2635,15 @@ var MatDatepicker = /** @class */ (function () {
             });
         }
     };
+    /** Create the popup. */
     /**
      * Create the popup.
+     * @private
      * @return {?}
      */
     MatDatepicker.prototype._createPopup = /**
      * Create the popup.
+     * @private
      * @return {?}
      */
     function () {
@@ -2539,12 +2665,15 @@ var MatDatepicker = /** @class */ (function () {
                 (_this._datepickerInput && event.altKey && event.keyCode === keycodes.UP_ARROW);
         }))).subscribe(function () { return _this.close(); });
     };
+    /** Create the popup PositionStrategy. */
     /**
      * Create the popup PositionStrategy.
+     * @private
      * @return {?}
      */
     MatDatepicker.prototype._createPopupPositionStrategy = /**
      * Create the popup PositionStrategy.
+     * @private
      * @return {?}
      */
     function () {
@@ -2582,22 +2711,31 @@ var MatDatepicker = /** @class */ (function () {
         ]);
     };
     /**
+     * @param obj The object to check.
+     * @returns The given object if it is both a date instance and valid, otherwise null.
+     */
+    /**
+     * @private
      * @param {?} obj The object to check.
      * @return {?} The given object if it is both a date instance and valid, otherwise null.
      */
     MatDatepicker.prototype._getValidDateOrNull = /**
+     * @private
      * @param {?} obj The object to check.
      * @return {?} The given object if it is both a date instance and valid, otherwise null.
      */
     function (obj) {
         return (this._dateAdapter.isDateInstance(obj) && this._dateAdapter.isValid(obj)) ? obj : null;
     };
+    /** Passes the current theme color along to the calendar overlay. */
     /**
      * Passes the current theme color along to the calendar overlay.
+     * @private
      * @return {?}
      */
     MatDatepicker.prototype._setColor = /**
      * Passes the current theme color along to the calendar overlay.
+     * @private
      * @return {?}
      */
     function () {
@@ -2649,19 +2787,21 @@ var MatDatepicker = /** @class */ (function () {
 
 /**
  * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
+ * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
-/** *
+/**
  * \@docs-private
-  @type {?} */
+ * @type {?}
+ */
 var MAT_DATEPICKER_VALUE_ACCESSOR = {
     provide: forms.NG_VALUE_ACCESSOR,
     useExisting: core.forwardRef(function () { return MatDatepickerInput; }),
     multi: true
 };
-/** *
+/**
  * \@docs-private
-  @type {?} */
+ * @type {?}
+ */
 var MAT_DATEPICKER_VALIDATORS = {
     provide: forms.NG_VALIDATORS,
     useExisting: core.forwardRef(function () { return MatDatepickerInput; }),
@@ -2980,11 +3120,14 @@ var MatDatepickerInput = /** @class */ (function () {
         return this._formField ? this._formField.getConnectedOverlayOrigin() : this._elementRef;
     };
     // Implemented as part of ControlValueAccessor.
+    // Implemented as part of ControlValueAccessor.
     /**
      * @param {?} value
      * @return {?}
      */
-    MatDatepickerInput.prototype.writeValue = /**
+    MatDatepickerInput.prototype.writeValue = 
+    // Implemented as part of ControlValueAccessor.
+    /**
      * @param {?} value
      * @return {?}
      */
@@ -2992,11 +3135,14 @@ var MatDatepickerInput = /** @class */ (function () {
         this.value = value;
     };
     // Implemented as part of ControlValueAccessor.
+    // Implemented as part of ControlValueAccessor.
     /**
      * @param {?} fn
      * @return {?}
      */
-    MatDatepickerInput.prototype.registerOnChange = /**
+    MatDatepickerInput.prototype.registerOnChange = 
+    // Implemented as part of ControlValueAccessor.
+    /**
      * @param {?} fn
      * @return {?}
      */
@@ -3004,11 +3150,14 @@ var MatDatepickerInput = /** @class */ (function () {
         this._cvaOnChange = fn;
     };
     // Implemented as part of ControlValueAccessor.
+    // Implemented as part of ControlValueAccessor.
     /**
      * @param {?} fn
      * @return {?}
      */
-    MatDatepickerInput.prototype.registerOnTouched = /**
+    MatDatepickerInput.prototype.registerOnTouched = 
+    // Implemented as part of ControlValueAccessor.
+    /**
      * @param {?} fn
      * @return {?}
      */
@@ -3016,11 +3165,14 @@ var MatDatepickerInput = /** @class */ (function () {
         this._onTouched = fn;
     };
     // Implemented as part of ControlValueAccessor.
+    // Implemented as part of ControlValueAccessor.
     /**
      * @param {?} isDisabled
      * @return {?}
      */
-    MatDatepickerInput.prototype.setDisabledState = /**
+    MatDatepickerInput.prototype.setDisabledState = 
+    // Implemented as part of ControlValueAccessor.
+    /**
      * @param {?} isDisabled
      * @return {?}
      */
@@ -3100,13 +3252,16 @@ var MatDatepickerInput = /** @class */ (function () {
         }
         this._onTouched();
     };
+    /** Formats a value and sets it on the input element. */
     /**
      * Formats a value and sets it on the input element.
+     * @private
      * @param {?} value
      * @return {?}
      */
     MatDatepickerInput.prototype._formatValue = /**
      * Formats a value and sets it on the input element.
+     * @private
      * @param {?} value
      * @return {?}
      */
@@ -3115,10 +3270,16 @@ var MatDatepickerInput = /** @class */ (function () {
             value ? this._dateAdapter.format(value, this._dateFormats.display.dateInput) : '';
     };
     /**
+     * @param obj The object to check.
+     * @returns The given object if it is both a date instance and valid, otherwise null.
+     */
+    /**
+     * @private
      * @param {?} obj The object to check.
      * @return {?} The given object if it is both a date instance and valid, otherwise null.
      */
     MatDatepickerInput.prototype._getValidDateOrNull = /**
+     * @private
      * @param {?} obj The object to check.
      * @return {?} The given object if it is both a date instance and valid, otherwise null.
      */
@@ -3169,7 +3330,7 @@ var MatDatepickerInput = /** @class */ (function () {
 
 /**
  * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
+ * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 /**
  * Can be used to override the icon of a `matDatepickerToggle`.
@@ -3224,7 +3385,7 @@ var MatDatepickerToggle = /** @class */ (function () {
      * @return {?}
      */
     function (changes) {
-        if (changes["datepicker"]) {
+        if (changes.datepicker) {
             this._watchStateChanges();
         }
     };
@@ -3261,9 +3422,11 @@ var MatDatepickerToggle = /** @class */ (function () {
         }
     };
     /**
+     * @private
      * @return {?}
      */
     MatDatepickerToggle.prototype._watchStateChanges = /**
+     * @private
      * @return {?}
      */
     function () {
@@ -3282,7 +3445,7 @@ var MatDatepickerToggle = /** @class */ (function () {
     };
     MatDatepickerToggle.decorators = [
         { type: core.Component, args: [{selector: 'mat-datepicker-toggle',
-                    template: "<button #button mat-icon-button type=\"button\" aria-haspopup=\"true\" [attr.aria-label]=\"_intl.openCalendarLabel\" [attr.tabindex]=\"disabled ? -1 : tabIndex\" [disabled]=\"disabled\" [disableRipple]=\"disableRipple\" (click)=\"_open($event)\"><svg *ngIf=\"!_customIcon\" class=\"mat-datepicker-toggle-default-icon\" viewBox=\"0 0 24 24\" width=\"24px\" height=\"24px\" fill=\"currentColor\" focusable=\"false\"><path d=\"M0 0h24v24H0z\" fill=\"none\"/><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\"/></svg><ng-content select=\"[matDatepickerToggleIcon]\"></ng-content></button>",
+                    template: "<button #button mat-icon-button type=\"button\" aria-haspopup=\"true\" [attr.aria-label]=\"_intl.openCalendarLabel\" [attr.tabindex]=\"disabled ? -1 : tabIndex\" [disabled]=\"disabled\" [disableRipple]=\"disableRipple\" (click)=\"_open($event)\"><svg *ngIf=\"!_customIcon\" class=\"mat-datepicker-toggle-default-icon\" viewBox=\"0 0 24 24\" width=\"24px\" height=\"24px\" fill=\"currentColor\" focusable=\"false\"><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\"/></svg><ng-content select=\"[matDatepickerToggleIcon]\"></ng-content></button>",
                     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}"],
                     host: {
                         'class': 'mat-datepicker-toggle',
@@ -3318,7 +3481,7 @@ var MatDatepickerToggle = /** @class */ (function () {
 
 /**
  * @fileoverview added by tsickle
- * @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
+ * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
  */
 var MatDatepickerModule = /** @class */ (function () {
     function MatDatepickerModule() {