diff --git a/src/components/input-date-picker/input-date-picker.stories.ts b/src/components/input-date-picker/input-date-picker.stories.ts index 7e742b5eed3..31ab8c82098 100644 --- a/src/components/input-date-picker/input-date-picker.stories.ts +++ b/src/components/input-date-picker/input-date-picker.stories.ts @@ -31,8 +31,6 @@ export const range = (): string => html`
@@ -809,16 +765,6 @@ export class InputDatePicker this.setReferenceEl(); }; - @Watch("start") - startWatcher(start: string): void { - this.startAsDate = dateFromISO(start); - } - - @Watch("end") - endWatcher(end: string): void { - this.endAsDate = end ? setEndOfDay(dateFromISO(end)) : dateFromISO(end); - } - @Watch("effectiveLocale") private async loadLocaleData(): Promise { if (!Build.isBrowser) { @@ -849,21 +795,15 @@ export class InputDatePicker }; private shouldFocusRangeStart(): boolean { - return !!( - this.endAsDate && - !this.startAsDate && - this.focusedInput === "end" && - this.startInput - ); + const startValue = this.value[0] || undefined; + const endValue = this.value[1] || undefined; + return !!(endValue && !startValue && this.focusedInput === "end" && this.startInput); } private shouldFocusRangeEnd(): boolean { - return !!( - this.startAsDate && - !this.endAsDate && - this.focusedInput === "start" && - this.endInput - ); + const startValue = this.value[0] || undefined; + const endValue = this.value[1] || undefined; + return !!(startValue && !endValue && this.focusedInput === "start" && this.endInput); } private handleDateRangeChange = (event: CustomEvent): void => { @@ -887,12 +827,18 @@ export class InputDatePicker private localizeInputValues(): void { const date = dateFromRange( - this.range ? this.startAsDate : this.valueAsDate, + (this.range + ? (Array.isArray(this.valueAsDate) && this.valueAsDate[0]) || undefined + : this.valueAsDate) as Date, this.minAsDate, this.maxAsDate ); const endDate = this.range - ? dateFromRange(this.endAsDate, this.minAsDate, this.maxAsDate) + ? dateFromRange( + (Array.isArray(this.valueAsDate) && this.valueAsDate[1]) || undefined, + this.minAsDate, + this.maxAsDate + ) : null; const localizedDate = @@ -935,8 +881,6 @@ export class InputDatePicker this.userChangedValue = true; this.value = newValue; this.valueAsDate = newValue ? getValueAsDateRange(newValue) : undefined; - this.start = newStartDateISO; - this.end = newEndDateISO; const eventDetail = { startDate: newStartDate as Date,