From ffa115df401a06c81f095521736adabbc5e6e8b2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Martin=20Sko=C4=8D=C3=ADk?= Date: Thu, 12 Dec 2024 18:56:48 +0100 Subject: [PATCH] make types more strict to correctly export value type --- jsconfig.json | 5 +++-- src/lib/components/Calendar.svelte | 4 ++-- src/lib/components/SveltyPicker.svelte | 28 ++++++++++++++------------ src/lib/components/Time.svelte | 21 +++++++++++-------- src/lib/utils/state.js | 2 +- src/routes/+layout.svelte | 21 ++----------------- 6 files changed, 36 insertions(+), 45 deletions(-) diff --git a/jsconfig.json b/jsconfig.json index 7dc63d1..955879d 100644 --- a/jsconfig.json +++ b/jsconfig.json @@ -8,7 +8,8 @@ "sourceMap": true, "allowJs": true, "checkJs": true, - "module": "NodeNext", - "moduleResolution": "NodeNext" + "moduleResolution": "bundler", + "strictNullChecks": true, + "exactOptionalPropertyTypes": true } } diff --git a/src/lib/components/Calendar.svelte b/src/lib/components/Calendar.svelte index 7ac7127..c5f2fa9 100644 --- a/src/lib/components/Calendar.svelte +++ b/src/lib/components/Calendar.svelte @@ -182,13 +182,13 @@ const dateYear = date.getFullYear(); const startYear = computedStartDate?.getFullYear(); const endYear = endDate?.getFullYear(); - if (computedStartDate) { + if (startYear && computedStartDate) { if ( (startYear === dateYear && computedStartDate.getMonth() > date.getMonth()) || (startYear > dateYear) ) return true; } - if (endDate) { + if (endYear && endDate) { if ( (endYear === dateYear && endDate.getMonth() < date.getMonth()) || endYear < dateYear diff --git a/src/lib/components/SveltyPicker.svelte b/src/lib/components/SveltyPicker.svelte index 57cdc55..c91a1cb 100644 --- a/src/lib/components/SveltyPicker.svelte +++ b/src/lib/components/SveltyPicker.svelte @@ -19,16 +19,16 @@ * inputId?: string, * name?: string, * disabled?: boolean, - * placeholder?: string|null|undefined, + * placeholder?: string|null, * required?: boolean, - * value?: string|string[]|null|undefined, + * value?: string|string[]|null, * isRange?: boolean, * startDate?: Date | string | null, * endDate?: Date | string | null, * pickerOnly?: boolean, * startView?: number, * mode?: 'auto'|'date'|'datetime'|'time', - * disableDatesFn?: (currentDate: Date) => boolean, + * disableDatesFn?: ((currentDate: Date) => boolean) | null, * manualInput?: boolean, theme?: string, * format?: string, * formatType?: string, @@ -48,19 +48,19 @@ * validatorAction?: Array|null, * ce_valueElement?: HTMLInputElement|null, * ce_displayElement?: HTMLInputElement|null, - * positionResolver?: Function|null, - * onChange?: (value: string|string[]) => void, + * positionResolver?: Function, + * onChange?: (value: string|string[]|null) => void, * onDateChange?: (prop: { - * value: string|string[], - * dateValue: Date|Date[], + * value: string|string[]|null, + * dateValue: Date|Date[]|null, * displayValue: string, * valueFormat: string, - * displayFormat: string, + * displayFormat: string | null, * event: 'date'|'hour'|'minute'|'datetime' * }) => void, * onCancel?: () => void, * onBlur?: () => void, - * onInput?: (currentValue: string) => void, + * onInput?: (currentValue: string|null) => void, * actionRow?: import('svelte').Snippet<[ * autocloseSupported: boolean, * todayBtnClasses: string, @@ -69,7 +69,7 @@ * onConfirm: function, * onClear: function, * onToday: function, - * isTodayDisabled: boolean, + * isTodayDisabled: boolean|null, * i18n: import('$lib/i18n/index.js').i18nType, * currentMode: string * ]>} @@ -80,7 +80,7 @@ disabled = false, placeholder = null, required = false, - value = $bindable(), + value = $bindable(null), isRange = false, startDate = null, endDate = null, @@ -120,13 +120,13 @@ if (isRange && Array.isArray(value) === false) console.warn('[svelty-picker] value property must be an array for range picker'); const { iDates, iValues, iValueCombined} = initProps(value, format, i18n, formatType); - /** @type {string} concated by `join()` */ + /** @type {string|null} concated by `join()` */ let prev_value = iValueCombined; let value_array = $state(iValues); let innerDates = $state(iDates.map(date => new SvelteDate(date))); // svelte-ignore state_referenced_locally let undoHistory = $state(iValues); - /** @type {string} @computed */ + /** @type {string|null} @computed */ let value_form = $derived(value_array.length ? value_array.join(',') : null); let value_display = $state(computeDisplayValue()); // svelte-ignore state_referenced_locally @@ -146,6 +146,7 @@ /** * @type {Array<{ ref: import('./Time.svelte').default }>} */ + // @ts-ignore let widgetList = $state( isRange ? [{ref: null}, {ref: null}] @@ -202,6 +203,7 @@ innerDates[0].getDate() === date.getDate() && resolvedMode === "date" && !required && clearToggle ) + // @ts-ignore date = null; } // standard diff --git a/src/lib/components/Time.svelte b/src/lib/components/Time.svelte index f122494..015b469 100644 --- a/src/lib/components/Time.svelte +++ b/src/lib/components/Time.svelte @@ -6,16 +6,15 @@ * @type {{ * wid?: number * date?: Date, - * startDate?: Date, - * endDate?: Date, + * startDate?: Date|null, + * endDate?: Date|null, * hourOnly?: boolean, * minuteIncrement?: number, * showMeridian?: boolean, * hasDateComponent?: boolean, - * i18n?: import("$lib/i18n/index.js").i18nType, - * ontime?: (date: Date) => void, - * onupdate?: (updateProp: import('$lib/types/internal.js').UpdateProp) => void, - * onswitch?: (date: string) => void, + * i18n: import("$lib/i18n/index.js").i18nType, + * onupdate: (updateProp: import('$lib/types/internal.js').UpdateProp) => void, + * onswitch: (date: string) => void, * }} */ @@ -70,7 +69,11 @@ let handleMoveMove = $state(false); let enableViewToggle = $state(true); /** @type {SvelteDate} */ - let innerDate = $state(null); + let innerDate = $state(function() { + const date = new SvelteDate(); + date.setHours(0,0); + return date; + }()); watch_date(date); let selectedHour = $derived(innerDate?.getHours() || 0); @@ -99,7 +102,9 @@ } else if (!passedValue) { isMinuteView = false; if (!innerDate) { - innerDate = new SvelteDate(); + const date = new SvelteDate(); + date.setHours(0,0); + innerDate = date; } else { innerDate.setHours(0, 0); } diff --git a/src/lib/utils/state.js b/src/lib/utils/state.js index d05ae90..da0cb02 100644 --- a/src/lib/utils/state.js +++ b/src/lib/utils/state.js @@ -3,7 +3,7 @@ import { formatDate, parseDate } from "./dateUtils.js"; /** * @typedef {object} ValueInit * @property {string[]} iValues - * @property {?string} iValueCombined + * @property {string|null} iValueCombined * @property {Date[]} iDates */ diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index c69f385..50b3cc2 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -119,7 +119,7 @@ Svelty Picker
- +