feat(datepicker): fix clear dates event bug (#982)

Author: dilandoogan

src/components/datepicker/bl-datepicker.test.ts

@@ -95,11 +95,20 @@ describe("BlDatepicker", () => {
     element._selectedDates = [new Date(2023, 1, 1)];
     await element.updateComplete;
 
+    element.addEventListener("bl-datepicker-change", (event) => {
+      const customEvent = event as CustomEvent;
+
+      expect(customEvent).to.exist;
+      expect(customEvent.detail).to.deep.equal([]);
+
+    });
+
     const clearButton = element.shadowRoot?.querySelector("bl-button") as BlButton;
 
     clearButton?.click();
     await element.updateComplete;
 
+
     expect(element._selectedDates).to.deep.equal([]);
     expect(element._inputValue).to.equal("");
   });

src/components/datepicker/bl-datepicker.ts

@@ -147,10 +147,10 @@ export default class BlDatepicker extends DatepickerCalendarMixin {
   }
 
   clearDatepicker() {
-    this._calendarEl.handleClearSelectedDates();
     this._selectedDates = [];
     this._inputValue = "";
     this._floatingDateCount = 0;
+    this._calendarEl.handleClearSelectedDates();
   }
 
   openPopover() {
@@ -242,7 +242,7 @@ export default class BlDatepicker extends DatepickerCalendarMixin {
               variant="tertiary"
               kind="neutral"
               icon="close"
-              @click=${() => this.clearDatepicker()}
+              @click=${this.clearDatepicker}
             ></bl-button>
             <div class="action-divider"></div>`
         : "";