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

timeZone property sets timezone for display. Value is always expected to be UTC (in- and outbound)

Browse Source
This commit is contained in:
trading_peter
2026-03-24 11:56:00 +01:00
parent 722e674526
commit acf1728cb9
2 changed files with 12 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
tp-date-input.js
View File

@@ -301,25 +301,17 @@ class TpDateInput extends EventHelpers(ControlState(FormElement(LitElement))) {
}
}).join('-');
const dt = DateTime.fromFormat(i0 + '-' + i1 + '-' + i2, luxonFormat);
// Parse the date in the specified timezone (or local if not set).
// This interprets the entered values as being in that timezone.
const dt = DateTime.fromFormat(i0 + '-' + i1 + '-' + i2, luxonFormat, { zone: this.timeZone || 'local' });
if (dt.isValid) {
this.inputs[0].invalid = false;
this.inputs[1].invalid = false;
this.inputs[2].invalid = false;
// If timeZone is specified, interpret the entered date values as being in that timezone
// and output as UTC. This ensures filters work correctly against UTC-stored dates.
let finalDt;
if (this.timeZone) {
// keepLocalTime: true interprets the entered values as being in the specified timezone
finalDt = this.timeZone ? dt.setZone(this.timeZone, { keepLocalTime: true }) : dt;
} else {
finalDt = dt;
}
this.date = finalDt.toJSDate();
this.value = finalDt.toUTC().toISO();
this.date = dt.toJSDate();
this.value = dt.toUTC().toISO();
this.invalid = false;
this.dispatchEvent(new CustomEvent('value-changed', { detail: this.value, bubbles: true, composed: true }));
} else {
@@ -473,8 +465,13 @@ class TpDateInput extends EventHelpers(ControlState(FormElement(LitElement))) {
return;
}
const dt = this._toDateTime(this.value);
let dt = this._toDateTime(this.value);
if (dt && dt.isValid) {
// Convert to user's timezone for display (input values are expected to be UTC)
if (this.timeZone) {
dt = dt.setZone(this.timeZone);
}
// Convert luxon format parts to match display format
this._input0 = dt.toFormat(this._getLuxonFormat(this._inputAssign[0]));
this._input1 = dt.toFormat(this._getLuxonFormat(this._inputAssign[1]));