refactor(date-picker-month, date-picker-month-header)!: Remove events. (

#6060) BREAKING CHANGE: Removed events. - Removed the event `calciteDatePickerSelect` on `CalciteDatePickerMonthHeader` - Removed the event `calciteDatePickerSelect` on `CalciteDatePickerMonth` - Removed the event `calciteDatePickerActiveDateChange` on `CalciteDatePickerMonth`
Esri · Dec 15, 2022 · ae27e75 · ae27e75
1 parent 132d243
commit ae27e75
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 11 deletions.
diff --git a/src/components/date-picker-month-header/date-picker-month-header.tsx b/src/components/date-picker-month-header/date-picker-month-header.tsx
@@ -80,8 +80,10 @@ export class DatePickerMonthHeader {
   //--------------------------------------------------------------------------
   /**
    *  Changes to active date
+   *
+   * @internal
    */
-  @Event({ cancelable: false }) calciteDatePickerSelect: EventEmitter<Date>;
+  @Event({ cancelable: false }) calciteInternalDatePickerSelect: EventEmitter<Date>;
 
   //--------------------------------------------------------------------------
   //
@@ -291,7 +293,7 @@ export class DatePickerMonthHeader {
    */
   private handleArrowClick = (event: MouseEvent | KeyboardEvent, date: Date): void => {
     event.preventDefault();
-    this.calciteDatePickerSelect.emit(date);
+    this.calciteInternalDatePickerSelect.emit(date);
   };
 
   private getInRangeDate({
@@ -338,7 +340,7 @@ export class DatePickerMonthHeader {
 
     // if you've supplied a year and it's in range, update active date
     if (inRangeDate) {
-      this.calciteDatePickerSelect.emit(inRangeDate);
+      this.calciteInternalDatePickerSelect.emit(inRangeDate);
     }
 
     if (commit) {

diff --git a/src/components/date-picker-month/date-picker-month.tsx b/src/components/date-picker-month/date-picker-month.tsx
@@ -72,8 +72,10 @@ export class DatePickerMonth {
 
   /**
    * Event emitted when user selects the date.
+   *
+   * @internal
    */
-  @Event({ cancelable: false }) calciteDatePickerSelect: EventEmitter<Date>;
+  @Event({ cancelable: false }) calciteInternalDatePickerSelect: EventEmitter<Date>;
 
   /**
    * Event emitted when user hovers the date.
@@ -84,8 +86,10 @@ export class DatePickerMonth {
 
   /**
    * Active date for the user keyboard access.
+   *
+   * @internal
    */
-  @Event({ cancelable: false }) calciteDatePickerActiveDateChange: EventEmitter<Date>;
+  @Event({ cancelable: false }) calciteInternalDatePickerActiveDateChange: EventEmitter<Date>;
 
   /**
    * @internal
@@ -241,7 +245,9 @@ export class DatePickerMonth {
   private addMonths(step: number) {
     const nextDate = new Date(this.activeDate);
     nextDate.setMonth(this.activeDate.getMonth() + step);
-    this.calciteDatePickerActiveDateChange.emit(dateFromRange(nextDate, this.min, this.max));
+    this.calciteInternalDatePickerActiveDateChange.emit(
+      dateFromRange(nextDate, this.min, this.max)
+    );
     this.activeFocus = true;
   }
 
@@ -253,7 +259,9 @@ export class DatePickerMonth {
   private addDays(step = 0) {
     const nextDate = new Date(this.activeDate);
     nextDate.setDate(this.activeDate.getDate() + step);
-    this.calciteDatePickerActiveDateChange.emit(dateFromRange(nextDate, this.min, this.max));
+    this.calciteInternalDatePickerActiveDateChange.emit(
+      dateFromRange(nextDate, this.min, this.max)
+    );
     this.activeFocus = true;
   }
 
@@ -376,7 +384,7 @@ export class DatePickerMonth {
 
   daySelect = (event: CustomEvent): void => {
     const target = event.target as HTMLCalciteDatePickerDayElement;
-    this.calciteDatePickerSelect.emit(target.value);
+    this.calciteInternalDatePickerSelect.emit(target.value);
   };
 
   /**

diff --git a/src/components/date-picker/date-picker.tsx b/src/components/date-picker/date-picker.tsx
@@ -455,7 +455,7 @@ export class DatePicker implements LocalizedComponent, T9nComponent {
           max={maxDate}
           messages={this.messages}
           min={minDate}
-          onCalciteDatePickerSelect={this.monthHeaderSelectChange}
+          onCalciteInternalDatePickerSelect={this.monthHeaderSelectChange}
           scale={this.scale}
           selectedDate={this.activeRange === "end" ? endDate : date || new Date()}
         />,
@@ -466,10 +466,10 @@ export class DatePicker implements LocalizedComponent, T9nComponent {
           localeData={this.localeData}
           max={maxDate}
           min={minDate}
-          onCalciteDatePickerActiveDateChange={this.monthActiveDateChange}
-          onCalciteDatePickerSelect={this.monthDateChange}
+          onCalciteInternalDatePickerActiveDateChange={this.monthActiveDateChange}
           onCalciteInternalDatePickerHover={this.monthHoverChange}
           onCalciteInternalDatePickerMouseOut={this.monthMouseOutChange}
+          onCalciteInternalDatePickerSelect={this.monthDateChange}
           scale={this.scale}
           selectedDate={this.activeRange === "end" ? endDate : date}
           startDate={this.range ? date : undefined}