refactor(date-picker, date-editor): apply requested changes

Author: jackofdiamond5

projects/igniteui-angular/src/lib/date-picker/date-picker.common.ts

@@ -6,7 +6,7 @@ import { IgxDatePickerComponent } from './date-picker.component';
  * when onDisabledDate event is fired.
  */
 export interface IDatePickerDisabledDateEventArgs extends IBaseEventArgs {
-    owner: IgxDatePickerComponent;
+    datePicker: IgxDatePickerComponent;
     currentValue: Date;
 }
 

projects/igniteui-angular/src/lib/date-picker/date-picker.component.ts

@@ -622,6 +622,26 @@ export class IgxDatePickerComponent extends PickerBaseDirective implements Contr
         }
     }
 
+    /**
+     * Selects today's date and closes the picker.
+     *
+     * @example
+     * ```html
+     * <igx-date-picker #picker></igx-date-picker>
+     *
+     * <button (click)="picker.selectToday()">Select Today</button>
+     * ```
+     * */
+    public selectToday(): void {
+        const today = new Date();
+        today.setHours(0);
+        today.setMinutes(0);
+        today.setSeconds(0);
+        today.setMilliseconds(0);
+        this.select(today);
+        this.close();
+    }
+
     /**
      * Clears the input field and the picker's value.
      *
@@ -815,7 +835,7 @@ export class IgxDatePickerComponent extends PickerBaseDirective implements Contr
             takeUntil(this._destroy$)).subscribe(newDate => {
                 this.value = newDate;
                 if (newDate && this.disabledDates && !isDateInRanges(newDate, this.disabledDates)) {
-                    this.onDisabledDate.emit({ currentValue: this.value, owner: this });
+                    this.onDisabledDate.emit({ currentValue: this.value, datePicker: this });
                 }
             });
         this.dateTimeEditor.validationFailed.pipe(
@@ -861,6 +881,7 @@ export class IgxDatePickerComponent extends PickerBaseDirective implements Contr
             this._collapsed = true;
             this._overlayId = null;
             this.closed.emit(event as IBaseEventArgs);
+            this._overlayService.detach(this._overlayId);
         });
     }
 
@@ -883,16 +904,6 @@ export class IgxDatePickerComponent extends PickerBaseDirective implements Contr
         }
     }
 
-    private selectToday() {
-        const today = new Date();
-        today.setHours(0);
-        today.setMinutes(0);
-        today.setSeconds(0);
-        today.setMilliseconds(0);
-        this.select(today);
-        this.close();
-    }
-
     private _initializeCalendarContainer(componentInstance: IgxCalendarContainerComponent) {
         this._calendar = componentInstance.calendar;
         const isVertical = this.headerOrientation === PickerHeaderOrientation.Vertical;

projects/igniteui-angular/src/lib/directives/date-time-editor/date-time-editor.directive.ts

@@ -456,7 +456,7 @@ export class IgxDateTimeEditorDirective extends IgxMaskDirective implements OnCh
       this.updateMask();
     }
 
-    // TODO: remove when formatter func has been deleted
+    // TODO: think of a better way to set displayValuePipe in mask directive
     if (this.displayValuePipe) {
       return;
     }

src/app/date-picker/date-picker.sample.html

@@ -2,7 +2,7 @@
     <article class="datepicker-column">
         <h4 class="sample-title">Default Date Picker</h4>
         <div class="preview">
-            <igx-date-picker #dp1 (valueChange)="model.control.markAsDirty()" [(value)]="date1">
+            <igx-date-picker #dp1 tabindex="-1" (valueChange)="model.control.markAsDirty()" [(value)]="date1">
                 <label igxLabel>Select a Date</label>
             </igx-date-picker>
         </div>
@@ -54,7 +54,7 @@ <h4 class="sample-title">Additional Icons And Custom Buttons</h4>
                 </igx-suffix>
                 <ng-template igxPickerActions>
                     <div class="action-buttons">
-                        <button igxButton="flat" (click)="this.selectToday()">Today</button>
+                        <button igxButton="flat" (click)="dp5.selectToday()">Today</button>
                     </div>
                 </ng-template>
             </igx-date-picker>

src/app/date-picker/date-picker.sample.ts

@@ -22,14 +22,4 @@ export class DatePickerSampleComponent {
 
     public disabledDates: DateRangeDescriptor[] = [{ type: DateRangeType.Specific, dateRange: [this.date1, this.date2, this.date3] }];
     public specialDates: DateRangeDescriptor[] = [{ type: DateRangeType.Specific, dateRange: [this.date5, this.date6, this.date7] }];
-
-    public selectToday() {
-        const today = new Date();
-        today.setHours(0);
-        today.setMinutes(0);
-        today.setSeconds(0);
-        today.setMilliseconds(0);
-        this.datePicker.select(today);
-        this.datePicker.close();
-    }
 }