refactor: fixing all FIXMEs

motss · Dec 14, 2021 · 67fc88b · 67fc88b
1 parent d8f219e
commit 67fc88b
Show file tree

Hide file tree

Showing 5 changed files with 84 additions and 53 deletions.
diff --git a/src/date-picker-dialog/date-picker-dialog.ts b/src/date-picker-dialog/date-picker-dialog.ts
@@ -1,31 +1,50 @@
 import type { TemplateResult } from 'lit';
 
-import { datePickerSlot } from '../helpers/date-picker-slot.js';
+import { slotDatePicker } from '../helpers/slot-date-picker.js';
 import { DatePickerDialogBase } from './date-picker-dialog-base.js';
 import type { DatePickerDialogProperties } from './typings.js';
 
 export class DatePickerDialog extends DatePickerDialogBase implements DatePickerDialogProperties {
   protected override $renderSlot(): TemplateResult {
-    return datePickerSlot({
-      disabledDates: this.disabledDates,
-      disabledDays: this.disabledDays,
-      firstDayOfWeek: this.firstDayOfWeek,
-      inline: this.inline,
-      landscape: this.landscape,
-      locale: this.locale,
-      max: this.max,
-      min: this.min,
-      nextMonthLabel: this.nextMonthLabel,
+    const {
+      disabledDates,
+      disabledDays,
+      firstDayOfWeek,
+      landscape,
+      locale,
+      max,
+      min,
+      nextMonthLabel,
+      previousMonthLabel,
+      selectedDateLabel,
+      showWeekNumber,
+      startView,
+      value,
+      weekLabel,
+      weekNumberType,
+      yearDropdownLabel,
+    } = this;
+
+    return slotDatePicker({
+      disabledDates,
+      disabledDays,
+      firstDayOfWeek,
+      inline: true,
+      landscape,
+      locale,
+      max,
+      min,
+      nextMonthLabel,
       onDatePickerDateUpdated: this.$onDatePickerDateUpdated,
       onDatePickerFirstUpdated: this.$onDatePickerFirstUpdated,
-      previousMonthLabel: this.previousMonthLabel,
-      selectedDateLabel: this.selectedDateLabel,
-      showWeekNumber: this.showWeekNumber,
-      startView: this.startView,
-      value: this.value,
-      weekLabel: this.weekLabel,
-      weekNumberType: this.weekNumberType,
-      yearDropdownLabel: this.yearDropdownLabel,
+      previousMonthLabel,
+      selectedDateLabel,
+      showWeekNumber,
+      startView,
+      value,
+      weekLabel,
+      weekNumberType,
+      yearDropdownLabel,
     });
   }
 }
diff --git a/src/date-picker-input/date-picker-input.ts b/src/date-picker-input/date-picker-input.ts
@@ -8,7 +8,7 @@ import { DateTimeFormat } from '../constants.js';
 import type { AppDatePicker } from '../date-picker/app-date-picker.js';
 import type { AppDatePickerInputSurface } from '../date-picker-input-surface/app-date-picker-input-surface.js';
 import { appDatePickerInputSurfaceName } from '../date-picker-input-surface/constants.js';
-import { datePickerSlot } from '../helpers/date-picker-slot.js';
+import { slotDatePicker } from '../helpers/slot-date-picker.js';
 import { toDateString } from '../helpers/to-date-string.js';
 import { warnUndefinedElement } from '../helpers/warn-undefined-element.js';
 import { iconClear } from '../icons.js';
@@ -202,26 +202,45 @@ export class DatePickerInput extends ElementMixin(DatePickerMixin(DatePickerMinM
   }
 
   protected $renderSlot(): TemplateResult {
-    return datePickerSlot({
-      disabledDates: this.disabledDates,
-      disabledDays: this.disabledDays,
-      firstDayOfWeek: this.firstDayOfWeek,
+    const {
+      disabledDates,
+      disabledDays,
+      firstDayOfWeek,
+      landscape,
+      locale,
+      max,
+      min,
+      nextMonthLabel,
+      previousMonthLabel,
+      selectedDateLabel,
+      showWeekNumber,
+      startView,
+      value,
+      weekLabel,
+      weekNumberType,
+      yearDropdownLabel,
+    } = this;
+
+    return slotDatePicker({
+      disabledDates,
+      disabledDays,
+      firstDayOfWeek,
       inline: true,
-      landscape: this.landscape,
-      locale: this.locale,
-      max: this.max,
-      min: this.min,
-      nextMonthLabel: this.nextMonthLabel,
+      landscape,
+      locale,
+      max,
+      min,
+      nextMonthLabel,
       onDatePickerDateUpdated: this.#onDatePickerDateUpdated,
       onDatePickerFirstUpdated: this.#onDatePickerFirstUpdated,
-      previousMonthLabel: this.previousMonthLabel,
-      selectedDateLabel: this.selectedDateLabel,
-      showWeekNumber: this.showWeekNumber,
-      startView: this.startView,
-      value: this.value,
-      weekLabel: this.weekLabel,
-      weekNumberType: this.weekNumberType,
-      yearDropdownLabel: this.yearDropdownLabel,
+      previousMonthLabel,
+      selectedDateLabel,
+      showWeekNumber,
+      startView,
+      value,
+      weekLabel,
+      weekNumberType,
+      yearDropdownLabel,
     });
   }
 

diff --git a/src/helpers/date-picker-slot.ts → src/helpers/slot-date-picker.ts b/src/helpers/date-picker-slot.ts → src/helpers/slot-date-picker.ts
@@ -3,11 +3,9 @@ import '../date-picker/app-date-picker.js';
 import type { TemplateResult } from 'lit';
 import { html } from 'lit';
 
-import { appDatePickerName } from '../date-picker/constants.js';
-import type { DatePickerSlotInit } from './typings.js';
-import { warnUndefinedElement } from './warn-undefined-element.js';
+import type { SlotDatePickerInit } from './typings.js';
 
-export function datePickerSlot({
+export function slotDatePicker({
   disabledDates,
   disabledDays,
   firstDayOfWeek,
@@ -26,9 +24,7 @@ export function datePickerSlot({
   weekLabel,
   weekNumberType,
   yearDropdownLabel,
-}: DatePickerSlotInit): TemplateResult {
-  warnUndefinedElement(appDatePickerName);
-
+}: SlotDatePickerInit): TemplateResult {
   return html`<app-date-picker
     ?showWeekNumber=${showWeekNumber}
     .disabledDates=${disabledDates}
@@ -50,5 +46,3 @@ export function datePickerSlot({
     @first-updated=${onDatePickerFirstUpdated}
   ></app-date-picker>`;
 }
-
-// FIXME: Make this a mixin instead
diff --git a/src/helpers/typings.ts b/src/helpers/typings.ts
@@ -3,11 +3,6 @@ import type { Calendar, CalendarInit, CalendarWeekday } from 'nodemod/dist/calen
 import type { ElementMixinProperties } from '../mixins/typings.js';
 import type { CustomEventDetail, DatePickerProperties, Formatters, OmitKey, SupportedKey } from '../typings.js';
 
-export interface DatePickerSlotInit extends OmitKey<DatePickerProperties, keyof ElementMixinProperties> {
-  onDatePickerDateUpdated(event: CustomEvent<CustomEventDetail['date-updated']['detail']>): Promise<void> | void;
-  onDatePickerFirstUpdated(event: CustomEvent<CustomEventDetail['first-updated']['detail']>): Promise<void> | void;
-}
-
 export interface DateValidatorResult {
   date: Date;
   isValid: boolean;
@@ -20,6 +15,11 @@ export interface MultiCalendars extends Omit<Calendar, 'calendar'> {
   weekdays: CalendarWeekday[];
 }
 
+export interface SlotDatePickerInit extends OmitKey<DatePickerProperties, keyof ElementMixinProperties> {
+  onDatePickerDateUpdated(event: CustomEvent<CustomEventDetail['date-updated']['detail']>): Promise<void> | void;
+  onDatePickerFirstUpdated(event: CustomEvent<CustomEventDetail['first-updated']['detail']>): Promise<void> | void;
+}
+
 export interface ToMultiCalendarsInit extends
 Pick<Formatters, 'dayFormat' | 'fullDateFormat' | 'longWeekdayFormat' | 'narrowWeekdayFormat'>,
 Partial<Pick<

diff --git a/src/year-grid-button/year-grid-button.ts b/src/year-grid-button/year-grid-button.ts
@@ -7,7 +7,6 @@ import { yearGridButtonStyling } from './stylings.js';
 export class YearGridButton extends ElementMixin(ButtonBase) {
   static override styles = [
     styles,
-    // FIXME(motss): Remove this hack once @material updates to use latest lit
-    yearGridButtonStyling as unknown as typeof styles,
+    yearGridButtonStyling,
   ];
 }