tp-elements/tp-date-input
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Make sure component always returns midnight utc

Browse Source
This commit is contained in:
trading_peter
2026-04-10 09:52:43 +02:00
parent acf1728cb9
commit 8f14196418
1 changed files with 12 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
tp-date-input.js
View File

@@ -292,7 +292,7 @@ class TpDateInput extends EventHelpers(ControlState(FormElement(LitElement))) {
} }
// Convert luxon format to match input assignment // Convert luxon format to match input assignment
const luxonFormat = this._inputAssign.map(part => { const format = this._inputAssign.map(part => {
switch (part) { switch (part) {
case 'MM': return 'LL'; case 'MM': return 'LL';
case 'dd': return 'dd'; case 'dd': return 'dd';
@@ -301,17 +301,18 @@ class TpDateInput extends EventHelpers(ControlState(FormElement(LitElement))) {
} }
}).join('-'); }).join('-');
// Parse the date in the specified timezone (or local if not set). // Parse the entered values as a plain calendar date, then store as UTC midnight.
// This interprets the entered values as being in that timezone. // Date-only fields are timezone-agnostic — April 7 means April 7 for everyone.
const dt = DateTime.fromFormat(i0 + '-' + i1 + '-' + i2, luxonFormat, { zone: this.timeZone || 'local' }); const dt = DateTime.fromFormat(i0 + '-' + i1 + '-' + i2, format);
if (dt.isValid) { if (dt.isValid) {
this.inputs[0].invalid = false; this.inputs[0].invalid = false;
this.inputs[1].invalid = false; this.inputs[1].invalid = false;
this.inputs[2].invalid = false; this.inputs[2].invalid = false;
this.date = dt.toJSDate(); const utcMidnight = DateTime.utc(dt.year, dt.month, dt.day);
this.value = dt.toUTC().toISO(); this.date = utcMidnight.toJSDate();
this.value = utcMidnight.toISO();
this.invalid = false; this.invalid = false;
this.dispatchEvent(new CustomEvent('value-changed', { detail: this.value, bubbles: true, composed: true })); this.dispatchEvent(new CustomEvent('value-changed', { detail: this.value, bubbles: true, composed: true }));
} else { } else {
@@ -467,12 +468,8 @@ class TpDateInput extends EventHelpers(ControlState(FormElement(LitElement))) {
let dt = this._toDateTime(this.value); let dt = this._toDateTime(this.value);
if (dt && dt.isValid) { if (dt && dt.isValid) {
// Convert to user's timezone for display (input values are expected to be UTC) // Values are stored as UTC midnight — display the UTC calendar date as-is.
if (this.timeZone) { dt = dt.toUTC();
dt = dt.setZone(this.timeZone);
}
// Convert luxon format parts to match display format
this._input0 = dt.toFormat(this._getLuxonFormat(this._inputAssign[0])); this._input0 = dt.toFormat(this._getLuxonFormat(this._inputAssign[0]));
this._input1 = dt.toFormat(this._getLuxonFormat(this._inputAssign[1])); this._input1 = dt.toFormat(this._getLuxonFormat(this._inputAssign[1]));
this._input2 = dt.toFormat(this._getLuxonFormat(this._inputAssign[2])); this._input2 = dt.toFormat(this._getLuxonFormat(this._inputAssign[2]));
@@ -493,7 +490,8 @@ class TpDateInput extends EventHelpers(ControlState(FormElement(LitElement))) {
if (this.today) { if (this.today) {
setTimeout(() => { setTimeout(() => {
if (!this.value) { if (!this.value) {
this.value = DateTime.now().toISO(); const now = DateTime.utc();
this.value = DateTime.utc(now.year, now.month, now.day).toISO();
} }
}); });
} }