Change duration input to ha-time-input component (#25800)

* Change duration input to ha-time-input component

* Change ha-time-input to duration-input component

* Add DurationDict to ForDict cast
This commit is contained in:
Bastian 2025-06-18 17:31:15 +02:00 committed by GitHub
parent 98dcce6af1
commit 723bb4dfeb
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -5,10 +5,14 @@ import { fireEvent } from "../../../../common/dom/fire_event";
import "../../../../components/ha-checkbox"; import "../../../../components/ha-checkbox";
import "../../../../components/ha-formfield"; import "../../../../components/ha-formfield";
import "../../../../components/ha-icon-picker"; import "../../../../components/ha-icon-picker";
import "../../../../components/ha-duration-input";
import "../../../../components/ha-textfield"; import "../../../../components/ha-textfield";
import type { DurationDict, Timer } from "../../../../data/timer"; import type { DurationDict, Timer } from "../../../../data/timer";
import { haStyle } from "../../../../resources/styles"; import { haStyle } from "../../../../resources/styles";
import type { HomeAssistant } from "../../../../types"; import type { HomeAssistant } from "../../../../types";
import { createDurationData } from "../../../../common/datetime/create_duration_data";
import type { HaDurationData } from "../../../../components/ha-duration-input";
import type { ForDict } from "../../../../data/automation";
@customElement("ha-timer-form") @customElement("ha-timer-form")
class HaTimerForm extends LitElement { class HaTimerForm extends LitElement {
@ -24,6 +28,8 @@ class HaTimerForm extends LitElement {
@state() private _duration!: string | number | DurationDict; @state() private _duration!: string | number | DurationDict;
@state() private _duration_data!: HaDurationData | undefined;
@state() private _restore!: boolean; @state() private _restore!: boolean;
set item(item: Timer) { set item(item: Timer) {
@ -39,6 +45,8 @@ class HaTimerForm extends LitElement {
this._duration = "00:00:00"; this._duration = "00:00:00";
this._restore = false; this._restore = false;
} }
this._setDurationData();
} }
public focus() { public focus() {
@ -79,14 +87,11 @@ class HaTimerForm extends LitElement {
"ui.dialogs.helper_settings.generic.icon" "ui.dialogs.helper_settings.generic.icon"
)} )}
></ha-icon-picker> ></ha-icon-picker>
<ha-textfield <ha-duration-input
.configValue=${"duration"} .configValue=${"duration"}
.value=${this._duration} .data=${this._duration_data}
@input=${this._valueChanged} @value-changed=${this._valueChanged}
.label=${this.hass.localize( ></ha-duration-input>
"ui.dialogs.helper_settings.timer.duration"
)}
></ha-textfield>
<ha-formfield <ha-formfield
.label=${this.hass.localize( .label=${this.hass.localize(
"ui.dialogs.helper_settings.timer.restore" "ui.dialogs.helper_settings.timer.restore"
@ -131,6 +136,25 @@ class HaTimerForm extends LitElement {
}); });
} }
private _setDurationData() {
let durationInput: string | number | ForDict;
if (typeof this._duration === "object" && this._duration !== null) {
const d = this._duration as DurationDict;
durationInput = {
hours: typeof d.hours === "string" ? parseFloat(d.hours) : d.hours,
minutes:
typeof d.minutes === "string" ? parseFloat(d.minutes) : d.minutes,
seconds:
typeof d.seconds === "string" ? parseFloat(d.seconds) : d.seconds,
};
} else {
durationInput = this._duration;
}
this._duration_data = createDurationData(durationInput);
}
static get styles(): CSSResultGroup { static get styles(): CSSResultGroup {
return [ return [
haStyle, haStyle,
@ -138,7 +162,8 @@ class HaTimerForm extends LitElement {
.form { .form {
color: var(--primary-text-color); color: var(--primary-text-color);
} }
ha-textfield { ha-textfield,
ha-duration-input {
display: block; display: block;
margin: 8px 0; margin: 8px 0;
} }