Add Date Selector

This commit is contained in:
Zack 2022-03-16 14:20:45 -05:00
parent 5d3d15072f
commit 4ac097f32b
4 changed files with 50 additions and 0 deletions

View File

@ -146,6 +146,7 @@ const SCHEMAS: {
}, },
boolean: { name: "Boolean", selector: { boolean: {} } }, boolean: { name: "Boolean", selector: { boolean: {} } },
time: { name: "Time", selector: { time: {} } }, time: { name: "Time", selector: { time: {} } },
date: { name: "Date", selector: { date: {} } },
action: { name: "Action", selector: { action: {} } }, action: { name: "Action", selector: { action: {} } },
text: { text: {
name: "Text", name: "Text",

View File

@ -0,0 +1,42 @@
import { html, LitElement } from "lit";
import { customElement, property } from "lit/decorators";
import type { HomeAssistant } from "../../types";
import type { DateSelector } from "../../data/selector";
import { fireEvent } from "../../common/dom/fire_event";
import "../ha-date-input";
@customElement("ha-selector-date")
export class HaDateSelector extends LitElement {
@property() public hass!: HomeAssistant;
@property() public selector!: DateSelector;
@property() public value?: string;
@property() public label?: string;
@property({ type: Boolean, reflect: true }) public disabled = false;
protected render() {
return html`
<ha-date-input
.label=${this.label}
.locale=${this.hass.locale}
.disabled=${this.disabled}
.value=${this.value}
@value-changed=${this._valueChanged}
>
</ha-date-input>
`;
}
private _valueChanged(ev: CustomEvent) {
fireEvent(this, "value-changed", { value: ev.detail.value });
}
}
declare global {
interface HTMLElementTagNameMap {
"ha-selector-date": HaDateSelector;
}
}

View File

@ -9,6 +9,7 @@ import "./ha-selector-area";
import "./ha-selector-attribute"; import "./ha-selector-attribute";
import "./ha-selector-boolean"; import "./ha-selector-boolean";
import "./ha-selector-color-rgb"; import "./ha-selector-color-rgb";
import "./ha-selector-date";
import "./ha-selector-device"; import "./ha-selector-device";
import "./ha-selector-duration"; import "./ha-selector-duration";
import "./ha-selector-entity"; import "./ha-selector-entity";

View File

@ -2,6 +2,7 @@ export type Selector =
| AddonSelector | AddonSelector
| AttributeSelector | AttributeSelector
| EntitySelector | EntitySelector
| DateSelector
| DeviceSelector | DeviceSelector
| DurationSelector | DurationSelector
| AreaSelector | AreaSelector
@ -40,6 +41,11 @@ export interface ColorRGBSelector {
color_rgb: {}; color_rgb: {};
} }
export interface DateSelector {
// eslint-disable-next-line @typescript-eslint/ban-types
date: {};
}
export interface DeviceSelector { export interface DeviceSelector {
device: { device: {
integration?: string; integration?: string;