jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-19 07:16:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix ALL the eslint warnings (#23165)

Browse Source 
* Fix many lint warnings

* Fix ALL lint warnings

* small fix

* type fixes
This commit is contained in:
Petar Petrov 2024-12-06 10:55:07 +02:00 committed by GitHub
parent f724d8e7a9
commit 7a12fd2853
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
308 changed files with 918 additions and 823 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
cast/src/receiver/layout/hc-lovelace.ts
View File

@ -25,9 +25,9 @@ class HcLovelace extends LitElement {
@property({ attribute: false })
public lovelaceConfig!: LovelaceConfig;
@property() public viewPath?: string | number | null;
@property({ attribute: false }) public viewPath?: string | number | null;
@property() public urlPath: string | null = null;
@property({ attribute: false }) public urlPath: string | null = null;
protected render(): TemplateResult {
const index = this._viewIndex;

10
cast/src/receiver/layout/hc-main.ts
View File

@ -144,10 +144,10 @@ export class HcMain extends HassElement {
}
if (senderId) {
this.sendMessage(senderId, status);
this._sendMessage(senderId, status);
} else {
for (const sender of castContext.getSenders()) {
this.sendMessage(sender.id, status);
this._sendMessage(sender.id, status);
}
}
}
@ -164,10 +164,10 @@ export class HcMain extends HassElement {
};
if (senderId) {
this.sendMessage(senderId, error);
this._sendMessage(senderId, error);
} else {
for (const sender of castContext.getSenders()) {
this.sendMessage(sender.id, error);
this._sendMessage(sender.id, error);
}
}
}
@ -394,7 +394,7 @@ export class HcMain extends HassElement {
}
}
private sendMessage(senderId: string, response: any) {
private _sendMessage(senderId: string, response: any) {
castContext.sendCustomMessage(CAST_NS, senderId, response);
}
}

15
eslint.config.mjs
View File

@ -7,10 +7,10 @@ import { fileURLToPath } from "node:url";
import js from "@eslint/js";
import { FlatCompat } from "@eslint/eslintrc";
const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);
const _filename = fileURLToPath(import.meta.url);
const _dirname = path.dirname(_filename);
const compat = new FlatCompat({
baseDirectory: __dirname,
baseDirectory: _dirname,
recommendedConfig: js.configs.recommended,
allConfig: js.configs.all,
});
@ -115,12 +115,21 @@ export default [
"@typescript-eslint/naming-convention": [
"warn",
{
selector: ["objectLiteralProperty", "objectLiteralMethod"],
format: null,
},
{
selector: ["variable"],
format: ["camelCase", "snake_case", "UPPER_CASE"],
leadingUnderscore: "allow",
trailingUnderscore: "allow",
},
{
selector: ["variable"],
modifiers: ["exported"],
format: ["camelCase", "PascalCase", "UPPER_CASE"],
},
{
selector: "typeLike",
format: ["PascalCase"],

1
gallery/src/components/demo-black-white-row.ts
View File

@ -9,6 +9,7 @@ import "../../../src/components/ha-card";
@customElement("demo-black-white-row")
class DemoBlackWhiteRow extends LitElement {
// eslint-disable-next-line lit/no-native-attributes
@property() title!: string;
@property() value?: any;

2
gallery/src/components/demo-card.ts
View File

@ -18,7 +18,7 @@ class DemoCard extends LitElement {
@property({ attribute: false }) public config!: DemoCardConfig;
@property({ type: Boolean }) public showConfig = false;
@property({ attribute: false, type: Boolean }) public showConfig = false;
@state() private _size?: number;

4
gallery/src/components/demo-cards.ts
View File

@ -44,11 +44,11 @@ class DemoCards extends LitElement {
`;
}
_showConfigToggled(ev) {
private _showConfigToggled(ev) {
this._showConfig = ev.target.checked;
}
_darkThemeToggled(ev) {
private _darkThemeToggled(ev) {
applyThemesOnElement(this._container, { themes: {} } as any, "default", {
dark: ev.target.checked,
});

4
gallery/src/components/demo-more-info.ts
View File

@ -10,9 +10,9 @@ import type { HomeAssistant } from "../../../src/types";
class DemoMoreInfo extends LitElement {
@property({ attribute: false }) public hass!: HomeAssistant;
@property() public entityId!: string;
@property({ attribute: false }) public entityId!: string;
@property({ type: Boolean }) public showConfig = false;
@property({ attribute: false, type: Boolean }) public showConfig = false;
render() {
const state = this._getState(this.entityId, this.hass.states);

4
gallery/src/components/demo-more-infos.ts
View File

@ -58,11 +58,11 @@ class DemoMoreInfos extends LitElement {
}
`;
_showConfigToggled(ev) {
private _showConfigToggled(ev) {
this._showConfig = ev.target.checked;
}
_darkThemeToggled(ev) {
private _darkThemeToggled(ev) {
applyThemesOnElement(
this.shadowRoot!.querySelector("#container"),
{

2
gallery/src/ha-gallery.ts
View File

@ -182,7 +182,7 @@ class HaGallery extends LitElement {
}
}
_menuTapped() {
private _menuTapped() {
this._drawer.open = !this._drawer.open;
}

13
gallery/src/pages/automation/editor-action.ts
View File

@ -63,11 +63,6 @@ class DemoHaAutomationEditorAction extends LitElement {
}
protected render(): TemplateResult {
const valueChanged = (ev) => {
const sampleIdx = ev.target.sampleIdx;
this.data[sampleIdx] = ev.detail.value;
this.requestUpdate();
};
return html`
<div class="options">
<ha-formfield label="Disabled">
@ -92,7 +87,7 @@ class DemoHaAutomationEditorAction extends LitElement {
.actions=${this.data[sampleIdx]}
.sampleIdx=${sampleIdx}
.disabled=${this._disabled}
@value-changed=${valueChanged}
@value-changed=${this._handleValueChange}
></ha-automation-action>
`
)}
@ -102,6 +97,12 @@ class DemoHaAutomationEditorAction extends LitElement {
`;
}
private _handleValueChange(ev) {
const sampleIdx = ev.target.sampleIdx;
this.data[sampleIdx] = ev.detail.value;
this.requestUpdate();
}
private _handleOptionChange(ev) {
this[`_${ev.target.name}`] = ev.target.checked;
}

13
gallery/src/pages/automation/editor-condition.ts
View File

@ -103,11 +103,6 @@ export class DemoAutomationEditorCondition extends LitElement {
}
protected render(): TemplateResult {
const valueChanged = (ev) => {
const sampleIdx = ev.target.sampleIdx;
this.data[sampleIdx] = ev.detail.value;
this.requestUpdate();
};
return html`
<div class="options">
<ha-formfield label="Disabled">
@ -132,7 +127,7 @@ export class DemoAutomationEditorCondition extends LitElement {
.conditions=${this.data[sampleIdx]}
.sampleIdx=${sampleIdx}
.disabled=${this._disabled}
@value-changed=${valueChanged}
@value-changed=${this._handleValueChange}
></ha-automation-condition>
`
)}
@ -142,6 +137,12 @@ export class DemoAutomationEditorCondition extends LitElement {
`;
}
private _handleValueChange(ev) {
const sampleIdx = ev.target.sampleIdx;
this.data[sampleIdx] = ev.detail.value;
this.requestUpdate();
}
private _handleOptionChange(ev) {
this[`_${ev.target.name}`] = ev.target.checked;
}

13
gallery/src/pages/automation/editor-trigger.ts
View File

@ -149,11 +149,6 @@ export class DemoAutomationEditorTrigger extends LitElement {
}
protected render(): TemplateResult {
const valueChanged = (ev) => {
const sampleIdx = ev.target.sampleIdx;
this.data[sampleIdx] = ev.detail.value;
this.requestUpdate();
};
return html`
<div class="options">
<ha-formfield label="Disabled">
@ -178,7 +173,7 @@ export class DemoAutomationEditorTrigger extends LitElement {
.triggers=${this.data[sampleIdx]}
.sampleIdx=${sampleIdx}
.disabled=${this._disabled}
@value-changed=${valueChanged}
@value-changed=${this._handleValueChange}
></ha-automation-trigger>
`
)}
@ -188,6 +183,12 @@ export class DemoAutomationEditorTrigger extends LitElement {
`;
}
private _handleValueChange(ev) {
const sampleIdx = ev.target.sampleIdx;
this.data[sampleIdx] = ev.detail.value;
this.requestUpdate();
}
private _handleOptionChange(ev) {
this[`_${ev.target.name}`] = ev.target.checked;
}

23
gallery/src/pages/automation/trace.ts
View File

@ -31,9 +31,8 @@ export class DemoAutomationTrace extends LitElement {
<hat-script-graph
.trace=${trace.trace}
.selected=${this._selected[idx]}
@graph-node-selected=${(ev) => {
this._selected = { ...this._selected, [idx]: ev.detail.path };
}}
@graph-node-selected=${this._handleGraphNodeSelected}
.sampleIdx=${idx}
></hat-script-graph>
<hat-trace-timeline
allowPick
@ -41,12 +40,8 @@ export class DemoAutomationTrace extends LitElement {
.trace=${trace.trace}
.logbookEntries=${trace.logbookEntries}
.selectedPath=${this._selected[idx]}
@value-changed=${(ev) => {
this._selected = {
...this._selected,
[idx]: ev.detail.value,
};
}}
@value-changed=${this._handleTimelineValueChanged}
.sampleIdx=${idx}
></hat-trace-timeline>
<button @click=${() => console.log(trace)}>Log trace</button>
</div>
@ -63,6 +58,16 @@ export class DemoAutomationTrace extends LitElement {
hass.updateTranslations("config", "en");
}
private _handleTimelineValueChanged(ev) {
const sampleIdx = ev.target.sampleIdx;
this._selected = { ...this._selected, [sampleIdx]: ev.detail.value };
}
private _handleGraphNodeSelected(ev) {
const sampleIdx = ev.target.sampleIdx;
this._selected = { ...this._selected, [sampleIdx]: ev.detail.path };
}
static get styles() {
return css`
ha-card {

32
gallery/src/pages/components/ha-form.ts
View File

@ -489,14 +489,8 @@ class DemoHaForm extends LitElement {
.title=${info.title}
.value=${this.data[idx]}
.disabled=${this.disabled[idx]}
@submitted=${() => {
this.disabled[idx] = true;
this.requestUpdate();
setTimeout(() => {
this.disabled[idx] = false;
this.requestUpdate();
}, 2000);
}}
@submitted=${this._handleSubmit}
.sampleIdx=${idx}
>
${["light", "dark"].map(
(slot) => html`
@ -511,10 +505,8 @@ class DemoHaForm extends LitElement {
.computeLabel=${(schema) =>
translations[schema.name] || schema.name}
.computeHelper=${() => "Helper text"}
@value-changed=${(e) => {
this.data[idx] = e.detail.value;
this.requestUpdate();
}}
@value-changed=${this._handleValueChanged}
.sampleIdx=${idx}
></ha-form>
`
)}
@ -523,6 +515,22 @@ class DemoHaForm extends LitElement {
})}
`;
}
private _handleValueChanged(ev) {
const sampleIdx = ev.target.sampleIdx;
this.data[sampleIdx] = ev.detail.value;
this.requestUpdate();
}
private _handleSubmit(ev) {
const sampleIdx = ev.target.sampleIdx;
this.disabled[sampleIdx] = true;
this.requestUpdate();
setTimeout(() => {
this.disabled[sampleIdx] = false;
this.requestUpdate();
}, 2000);
}
}
declare global {

19
gallery/src/pages/components/ha-selector.ts
View File

@ -590,13 +590,6 @@ class DemoHaSelector extends LitElement implements ProvideHassElement {
</div>
${SCHEMAS.map((info, idx) => {
const data = this.data[idx];
const valueChanged = (ev) => {
this.data[idx] = {
...data,
[ev.target.key]: ev.detail.value,
};
this.requestUpdate();
};
return html`
<demo-black-white-row .title=${info.name}>
${["light", "dark"].map((slot) =>
@ -613,7 +606,8 @@ class DemoHaSelector extends LitElement implements ProvideHassElement {
.value=${data[key] ?? value!.default}
.disabled=${this._disabled}
.required=${this._required}
@value-changed=${valueChanged}
@value-changed=${this._handleValueChanged}
.sampleIdx=${idx}
.helper=${this._helper ? "Helper text" : undefined}
></ha-selector>
</ha-settings-row>
@ -626,6 +620,15 @@ class DemoHaSelector extends LitElement implements ProvideHassElement {
`;
}
private _handleValueChanged(ev) {
const idx = ev.target.sampleIdx;
this.data[idx] = {
...this.data[idx],
[ev.target.key]: ev.detail.value,
};
this.requestUpdate();
}
private _handleOptionChange(ev) {
this[`_${ev.target.name}`] = ev.target.checked;
}

4
hassio/src/addon-store/hassio-addon-store.ts
View File

@ -136,7 +136,7 @@ export class HassioAddonStore extends LitElement {
this._manageRepositories(repositoryUrl);
}
this.addEventListener("hass-api-called", (ev) => this.apiCalled(ev));
this.addEventListener("hass-api-called", (ev) => this._apiCalled(ev));
this._loadData();
}
@ -179,7 +179,7 @@ export class HassioAddonStore extends LitElement {
}
}
private apiCalled(ev) {
private _apiCalled(ev) {
if (ev.detail.success) {
this._loadData();
}

20
hassio/src/backups/hassio-backups.ts
View File

@ -58,7 +58,7 @@ export class HassioBackups extends LitElement {
@property({ type: Boolean }) public narrow = false;
@property({ type: Boolean }) public isWide = false;
@property({ attribute: false, type: Boolean }) public isWide = false;
@state() private _selectedBackups: string[] = [];
@ -74,7 +74,7 @@ export class HassioBackups extends LitElement {
public connectedCallback(): void {
super.connectedCallback();
if (this.hass && this._firstUpdatedCalled) {
this.fetchBackups();
this._fetchBackups();
}
}
@ -107,7 +107,7 @@ export class HassioBackups extends LitElement {
protected firstUpdated(changedProperties: PropertyValues): void {
super.firstUpdated(changedProperties);
if (this.hass && this.isConnected) {
this.fetchBackups();
this._fetchBackups();
}
this._firstUpdatedCalled = true;
}
@ -280,7 +280,7 @@ export class HassioBackups extends LitElement {
private _handleAction(ev: CustomEvent<ActionDetail>) {
switch (ev.detail.index) {
case 0:
this.fetchBackups();
this._fetchBackups();
break;
case 1:
showHassioBackupLocationDialog(this, { supervisor: this.supervisor });
@ -303,13 +303,13 @@ export class HassioBackups extends LitElement {
showHassioBackupDialog(this, {
slug,
supervisor: this.supervisor,
onDelete: () => this.fetchBackups(),
onDelete: () => this._fetchBackups(),
}),
reloadBackup: () => this.fetchBackups(),
reloadBackup: () => this._fetchBackups(),
});
}
private async fetchBackups() {
private async _fetchBackups() {
this._isLoading = true;
await reloadHassioBackups(this.hass);
this._backups = await fetchHassioBackups(this.hass);
@ -341,7 +341,7 @@ export class HassioBackups extends LitElement {
});
return;
}
await this.fetchBackups();
await this._fetchBackups();
this._dataTable.clearSelection();
}
@ -350,7 +350,7 @@ export class HassioBackups extends LitElement {
showHassioBackupDialog(this, {
slug,
supervisor: this.supervisor,
onDelete: () => this.fetchBackups(),
onDelete: () => this._fetchBackups(),
});
}
@ -366,7 +366,7 @@ export class HassioBackups extends LitElement {
}
showHassioCreateBackupDialog(this, {
supervisor: this.supervisor!,
onCreate: () => this.fetchBackups(),
onCreate: () => this._fetchBackups(),
});
}

17
hassio/src/components/hassio-card-content.ts
View File

@ -9,23 +9,24 @@ import type { HomeAssistant } from "../../../src/types";
class HassioCardContent extends LitElement {
@property({ attribute: false }) public hass!: HomeAssistant;
// eslint-disable-next-line lit/no-native-attributes
@property() public title!: string;
@property() public description?: string;
@property({ type: Boolean }) public available = true;
@property({ type: Boolean }) public showTopbar = false;
@property({ attribute: false, type: Boolean }) public showTopbar = false;
@property() public topbarClass?: string;
@property({ attribute: false }) public topbarClass?: string;
@property() public iconTitle?: string;
@property({ attribute: false }) public iconTitle?: string;
@property() public iconClass?: string;
@property({ attribute: false }) public iconClass?: string;
@property() public icon = mdiHelpCircle;
@property() public iconImage?: string;
@property({ attribute: false }) public iconImage?: string;
protected render(): TemplateResult {
return html`
@ -35,7 +36,11 @@ class HassioCardContent extends LitElement {
${this.iconImage
? html`
<div class="icon_image ${this.iconClass}">
<img src=${this.iconImage} .title=${this.iconTitle} />
<img
src=${this.iconImage}
.title=${this.iconTitle}
alt=${this.iconTitle ?? ""}
/>
<div></div>
</div>
`

18
hassio/src/components/supervisor-backup-content.ts
View File

@ -73,23 +73,25 @@ export class SupervisorBackupContent extends LitElement {
@property({ attribute: false }) public backup?: HassioBackupDetail;
@property() public backupType: HassioBackupDetail["type"] = "full";
@property({ attribute: false })
public backupType: HassioBackupDetail["type"] = "full";
@property({ attribute: false }) public folders?: CheckboxItem[];
@property({ attribute: false }) public addons?: AddonCheckboxItem[];
@property({ type: Boolean }) public homeAssistant = false;
@property({ attribute: false, type: Boolean }) public homeAssistant = false;
@property({ type: Boolean }) public backupHasPassword = false;
@property({ attribute: false, type: Boolean }) public backupHasPassword =
false;
@property({ type: Boolean }) public onboarding = false;
@property() public backupName = "";
@property({ attribute: false }) public backupName = "";
@property() public backupPassword = "";
@property({ attribute: false }) public backupPassword = "";
@property() public confirmBackupPassword = "";
@property({ attribute: false }) public confirmBackupPassword = "";
@query("ha-textfield, ha-radio, ha-checkbox", true) private _focusTarget;
@ -191,7 +193,7 @@ export class SupervisorBackupContent extends LitElement {
>
<ha-checkbox
.checked=${this.homeAssistant}
@change=${this.toggleHomeAssistant}
@change=${this._toggleHomeAssistant}
>
</ha-checkbox>
</ha-formfield>`
@ -277,7 +279,7 @@ export class SupervisorBackupContent extends LitElement {
`;
}
private toggleHomeAssistant() {
private _toggleHomeAssistant() {
this.homeAssistant = !this.homeAssistant;
}

4
hassio/src/components/supervisor-formfield-label.ts
View File

@ -7,9 +7,9 @@ import "../../../src/components/ha-svg-icon";
class SupervisorFormfieldLabel extends LitElement {
@property({ type: String }) public label!: string;
@property({ type: String }) public imageUrl?: string;
@property({ attribute: false }) public imageUrl?: string;
@property({ type: String }) public iconPath?: string;
@property({ attribute: false }) public iconPath?: string;
@property({ type: String }) public version?: string;

4
hassio/src/dialogs/datadisk/dialog-hassio-datadisk.ts
View File

@ -95,7 +95,7 @@ class HassioDatadiskDialog extends LitElement {
.label=${this.dialogParams.supervisor.localize(
"dialog.datadisk_move.select_device"
)}
@selected=${this._select_device}
@selected=${this._selectDevice}
dialogInitialFocus
>
${this.devices.map(
@ -137,7 +137,7 @@ class HassioDatadiskDialog extends LitElement {
`;
}
private _select_device(ev) {
private _selectDevice(ev) {
this.selectedDevice = ev.target.value;
}

1
hassio/src/dialogs/markdown/dialog-hassio-markdown.ts
View File

@ -12,6 +12,7 @@ import type { HassioMarkdownDialogParams } from "./show-dialog-hassio-markdown";
class HassioMarkdownDialog extends LitElement {
@property({ attribute: false }) public hass!: HomeAssistant;
// eslint-disable-next-line lit/no-native-attributes
@property() public title!: string;
@property() public content!: string;

4
hassio/src/dialogs/network/dialog-hassio-network.ts
View File

@ -394,7 +394,7 @@ export class DialogHassioNetwork
`;
}
_toArray(data: string | string[]): string[] {
private _toArray(data: string | string[]): string[] {
if (Array.isArray(data)) {
if (data && typeof data[0] === "string") {
data = data[0];
@ -409,7 +409,7 @@ export class DialogHassioNetwork
return data;
}
_toString(data: string | string[]): string {
private _toString(data: string | string[]): string {
if (!data) {
return "";
}

2
hassio/src/ingress-view/hassio-ingress-view.ts
View File

@ -34,7 +34,7 @@ class HassioIngressView extends LitElement {
@property({ attribute: false }) public route!: Route;
@property({ type: Boolean }) public ingressPanel = false;
@property({ attribute: false, type: Boolean }) public ingressPanel = false;
@property({ type: Boolean }) public narrow = false;

8
hassio/src/update-available/update-available-card.ts
View File

@ -58,10 +58,10 @@ const SUPERVISOR_UPDATE_NAMES = {
supervisor: "Home Assistant Supervisor",
};
type updateType = "os" | "supervisor" | "core" | "addon";
type UpdateType = "os" | "supervisor" | "core" | "addon";
const changelogUrl = (
entry: updateType,
entry: UpdateType,
version: string
): string | undefined => {
if (entry === "addon") {
@ -99,7 +99,7 @@ class UpdateAvailableCard extends LitElement {
@property({ attribute: false }) public addonSlug?: string;
@state() private _updateType?: updateType;
@state() private _updateType?: UpdateType;
@state() private _changelogContent?: string;
@ -222,7 +222,7 @@ class UpdateAvailableCard extends LitElement {
const updateType = ["core", "os", "supervisor"].includes(pathPart)
? pathPart
: "addon";
this._updateType = updateType as updateType;
this._updateType = updateType as UpdateType;
switch (updateType) {
case "addon":

8
src/auth/ha-auth-flow.ts
View File

@ -30,17 +30,17 @@ type State = "loading" | "error" | "step";
export class HaAuthFlow extends LitElement {
@property({ attribute: false }) public authProvider?: AuthProvider;
@property() public clientId?: string;
@property({ attribute: false }) public clientId?: string;
@property() public redirectUri?: string;
@property({ attribute: false }) public redirectUri?: string;
@property() public oauth2State?: string;
@property({ attribute: false }) public oauth2State?: string;
@property({ attribute: false }) public localize!: LocalizeFunc;
@property({ attribute: false }) public step?: DataEntryFlowStep;
@property({ type: Boolean }) public initStoreToken = false;
@property({ attribute: false, type: Boolean }) public initStoreToken = false;
@state() private _storeToken = false;

8
src/auth/ha-authorize.ts
View File

@ -21,13 +21,13 @@ const appNames = {
@customElement("ha-authorize")
export class HaAuthorize extends litLocalizeLiteMixin(LitElement) {
@property() public clientId?: string;
@property({ attribute: false }) public clientId?: string;
@property() public redirectUri?: string;
@property({ attribute: false }) public redirectUri?: string;
@property() public oauth2State?: string;
@property({ attribute: false }) public oauth2State?: string;
@property() public translationFragment = "page-authorize";
@property({ attribute: false }) public translationFragment = "page-authorize";
@state() private _authProvider?: AuthProvider;

2
src/common/color/convert-color.ts
View File

@ -25,9 +25,11 @@ export const rgb2hex = (rgb: [number, number, number]): string =>
// Copyright (c) 2011-2019, Gregor Aisch
// Constants for XYZ and LAB conversion
/* eslint-disable @typescript-eslint/naming-convention */
const Xn = 0.95047;
const Yn = 1;
const Zn = 1.08883;
/* eslint-enable @typescript-eslint/naming-convention */
const t0 = 0.137931034; // 4 / 29
const t1 = 0.206896552; // 6 / 29

4
src/common/translations/entity-state.ts
View File

@ -12,7 +12,7 @@ export type FormatEntityAttributeValueFunc = (
attribute: string,
value?: any
) => string;
export type formatEntityAttributeNameFunc = (
export type FormatEntityAttributeNameFunc = (
stateObj: HassEntity,
attribute: string
) => string;
@ -26,7 +26,7 @@ export const computeFormatFunctions = async (
): Promise<{
formatEntityState: FormatEntityStateFunc;
formatEntityAttributeValue: FormatEntityAttributeValueFunc;
formatEntityAttributeName: formatEntityAttributeNameFunc;
formatEntityAttributeName: FormatEntityAttributeNameFunc;
}> => {
const { computeStateDisplay } = await import(
"../entity/compute_state_display"

1
src/common/translations/localize.ts
View File

@ -94,6 +94,7 @@ export const computeLocalize = async <Keys extends string = LocalizeKeys>(
resources: Resources,
formats?: FormatsType
): Promise<LocalizeFunc<Keys>> => {
// eslint-disable-next-line @typescript-eslint/naming-convention
const { IntlMessageFormat } = await import("intl-messageformat");
await polyfillLocaleData(language);

5
src/components/chart/ha-chart-base.ts
View File

@ -53,9 +53,9 @@ export class HaChartBase extends LitElement {
@property({ type: Number }) public height?: number;
@property({ type: Number }) public paddingYAxis = 0;
@property({ attribute: false, type: Number }) public paddingYAxis = 0;
@property({ type: Boolean }) public externalHidden = false;
@property({ attribute: false, type: Boolean }) public externalHidden = false;
@state() private _chartHeight?: number;
@ -316,6 +316,7 @@ export class HaChartBase extends LitElement {
.getContext("2d")!;
this._loading = true;
try {
// eslint-disable-next-line @typescript-eslint/naming-convention
const ChartConstructor = (await import("../../resources/chartjs")).Chart;
const computedStyles = getComputedStyle(this);

17
src/components/chart/state-history-chart-line.ts
View File

@ -32,25 +32,26 @@ export class StateHistoryChartLine extends LitElement {
@property() public identifier?: string;
@property({ type: Boolean }) public showNames = true;
@property({ attribute: false, type: Boolean }) public showNames = true;
@property({ type: Boolean }) public clickForMoreInfo = true;
@property({ attribute: false, type: Boolean }) public clickForMoreInfo = true;
@property({ attribute: false }) public startTime!: Date;
@property({ attribute: false }) public endTime!: Date;
@property({ type: Number }) public paddingYAxis = 0;
@property({ attribute: false, type: Number }) public paddingYAxis = 0;
@property({ type: Number }) public chartIndex?;
@property({ attribute: false, type: Number }) public chartIndex?;
@property({ type: Boolean }) public logarithmicScale = false;
@property({ attribute: false, type: Boolean }) public logarithmicScale =
false;
@property({ type: Number }) public minYAxis?: number;
@property({ attribute: false, type: Number }) public minYAxis?: number;
@property({ type: Number }) public maxYAxis?: number;
@property({ attribute: false, type: Number }) public maxYAxis?: number;
@property({ type: Boolean }) public fitYData = false;
@property({ attribute: false, type: Boolean }) public fitYData = false;
@state() private _chartData?: ChartData<"line">;

8
src/components/chart/state-history-chart-timeline.ts
View File

@ -30,9 +30,9 @@ export class StateHistoryChartTimeline extends LitElement {
@property() public identifier?: string;
@property({ type: Boolean }) public showNames = true;
@property({ attribute: false, type: Boolean }) public showNames = true;
@property({ type: Boolean }) public clickForMoreInfo = true;
@property({ attribute: false, type: Boolean }) public clickForMoreInfo = true;
@property({ type: Boolean }) public chunked = false;
@ -40,9 +40,9 @@ export class StateHistoryChartTimeline extends LitElement {
@property({ attribute: false }) public endTime!: Date;
@property({ type: Number }) public paddingYAxis = 0;
@property({ attribute: false, type: Number }) public paddingYAxis = 0;
@property({ type: Number }) public chartIndex?;
@property({ attribute: false, type: Number }) public chartIndex?;
@state() private _chartData?: ChartData<"timeline">;

31
src/components/chart/state-history-charts.ts
View File

@ -1,5 +1,5 @@
import type { CSSResultGroup, PropertyValues } from "lit";
import { css, html, LitElement, nothing } from "lit";
import { css, html, LitElement } from "lit";
import {
customElement,
eventOptions,
@ -7,6 +7,7 @@ import {
queryAll,
state,
} from "lit/decorators";
import type { RenderItemFunction } from "@lit-labs/virtualizer/virtualize";
import { isComponentLoaded } from "../../common/config/is_component_loaded";
import { restoreScroll } from "../../common/decorators/restore-scroll";
import type {
@ -58,21 +59,22 @@ export class StateHistoryCharts extends LitElement {
@property({ type: Boolean, attribute: "up-to-now" }) public upToNow = false;
@property({ type: Number }) public hoursToShow?: number;
@property({ attribute: false, type: Number }) public hoursToShow?: number;
@property({ type: Boolean }) public showNames = true;
@property({ attribute: false, type: Boolean }) public showNames = true;
@property({ type: Boolean }) public clickForMoreInfo = true;
@property({ attribute: false, type: Boolean }) public clickForMoreInfo = true;
@property({ type: Boolean }) public isLoadingData = false;
@property({ attribute: false, type: Boolean }) public isLoadingData = false;
@property({ type: Boolean }) public logarithmicScale = false;
@property({ attribute: false, type: Boolean }) public logarithmicScale =
false;
@property({ type: Number }) public minYAxis?: number;
@property({ attribute: false, type: Number }) public minYAxis?: number;
@property({ type: Number }) public maxYAxis?: number;
@property({ attribute: false, type: Number }) public maxYAxis?: number;
@property({ type: Boolean }) public fitYData = false;
@property({ attribute: false, type: Boolean }) public fitYData = false;
private _computedStartTime!: Date;
@ -122,6 +124,7 @@ export class StateHistoryCharts extends LitElement {
).concat(this.historyData.line)
: this.historyData.line;
// eslint-disable-next-line lit/no-this-assign-in-render
this._chartCount = combinedItems.length;
return this.virtualize
@ -139,12 +142,12 @@ export class StateHistoryCharts extends LitElement {
)}`;
}
private _renderHistoryItem = (
item: TimelineEntity[] | LineChartUnit,
index: number
) => {
private _renderHistoryItem: RenderItemFunction<
TimelineEntity[] | LineChartUnit
> = (item, index) => {
if (!item || index === undefined) {
return nothing;
// eslint-disable-next-line lit/prefer-nothing
return html``;
}
if (!Array.isArray(item)) {
return html`<div class="entry-container">

25
src/components/chart/statistics-chart.ts
View File

@ -63,28 +63,25 @@ export class StatisticsChart extends LitElement {
@property({ attribute: false }) public endTime?: Date;
@property({ type: Array }) public statTypes: Array<StatisticType> = [
"sum",
"min",
"mean",
"max",
];
@property({ attribute: false, type: Array })
public statTypes: Array<StatisticType> = ["sum", "min", "mean", "max"];
@property() public chartType: ChartType = "line";
@property({ attribute: false }) public chartType: ChartType = "line";
@property({ type: Number }) public minYAxis?: number;
@property({ attribute: false, type: Number }) public minYAxis?: number;
@property({ type: Number }) public maxYAxis?: number;
@property({ attribute: false, type: Number }) public maxYAxis?: number;
@property({ type: Boolean }) public fitYData = false;
@property({ attribute: false, type: Boolean }) public fitYData = false;
@property({ type: Boolean }) public hideLegend = false;
@property({ attribute: false, type: Boolean }) public hideLegend = false;
@property({ type: Boolean }) public logarithmicScale = false;
@property({ attribute: false, type: Boolean }) public logarithmicScale =
false;
@property({ type: Boolean }) public isLoadingData = false;
@property({ attribute: false, type: Boolean }) public isLoadingData = false;
@property({ type: Boolean }) public clickForMoreInfo = true;
@property({ attribute: false, type: Boolean }) public clickForMoreInfo = true;
@property() public period?: string;

4
src/components/data-table/dialog-data-table-settings.ts
View File

@ -185,7 +185,7 @@ export class DialogDataTableSettings extends LitElement {
this._params!.onUpdate(this._columnOrder, this._hiddenColumns);
}
_toggle(ev) {
private _toggle(ev) {
if (!this._params) {
return;
}
@ -266,7 +266,7 @@ export class DialogDataTableSettings extends LitElement {
this._params!.onUpdate(this._columnOrder, this._hiddenColumns);
}
_reset() {
private _reset() {
this._columnOrder = undefined;
this._hiddenColumns = undefined;

13
src/components/data-table/ha-data-table.ts
View File

@ -116,7 +116,7 @@ export class HaDataTable extends LitElement {
@property({ type: Boolean }) public clickable = false;
@property({ type: Boolean }) public hasFab = false;
@property({ attribute: false, type: Boolean }) public hasFab = false;
/**
* Add an extra row at the bottom of the data table
@ -127,24 +127,25 @@ export class HaDataTable extends LitElement {
@property({ type: Boolean, attribute: "auto-height" })
public autoHeight = false;
// eslint-disable-next-line lit/no-native-attributes
@property({ type: String }) public id = "id";
@property({ type: String }) public noDataText?: string;
@property({ attribute: false, type: String }) public noDataText?: string;
@property({ type: String }) public searchLabel?: string;
@property({ attribute: false, type: String }) public searchLabel?: string;
@property({ type: Boolean, attribute: "no-label-float" })
public noLabelFloat? = false;
@property({ type: String }) public filter = "";
@property() public groupColumn?: string;
@property({ attribute: false }) public groupColumn?: string;
@property({ attribute: false }) public groupOrder?: string[];
@property() public sortColumn?: string;
@property({ attribute: false }) public sortColumn?: string;
@property() public sortDirection: SortingDirection = null;
@property({ attribute: false }) public sortDirection: SortingDirection = null;
@property({ attribute: false }) public initialCollapsedGroups?: string[];

3
src/components/date-range-picker.ts
View File

@ -11,6 +11,7 @@ import {
} from "../common/datetime/localize_date";
import { mainWindow } from "../common/dom/get_main_window";
// eslint-disable-next-line @typescript-eslint/naming-convention
const CustomDateRangePicker = Vue.extend({
mixins: [DateRangePicker],
methods: {
@ -53,6 +54,7 @@ const CustomDateRangePicker = Vue.extend({
},
});
// eslint-disable-next-line @typescript-eslint/naming-convention
const Component = Vue.extend({
props: {
timePicker: {
@ -154,6 +156,7 @@ const Component = Vue.extend({
});
// Assertion corrects HTMLElement type from package
// eslint-disable-next-line @typescript-eslint/naming-convention
const WrappedElement = wrap(
Vue,
Component

2
src/components/device/ha-device-automation-picker.ts
View File

@ -24,7 +24,7 @@ export abstract class HaDeviceAutomationPicker<
@property() public label?: string;
@property() public deviceId?: string;
@property({ attribute: false }) public deviceId?: string;
@property({ type: Object }) public value?: T;

2
src/components/entity/ha-entities-picker.ts
View File

@ -75,7 +75,7 @@ class HaEntitiesPickerLight extends LitElement {
@property({ attribute: false })
public entityFilter?: HaEntityPickerEntityFilterFunc;
@property({ type: Array }) public createDomains?: string[];
@property({ attribute: false, type: Array }) public createDomains?: string[];
protected render() {
if (!this.hass) {

3
src/components/entity/ha-entity-attribute-picker.ts
View File

@ -13,7 +13,7 @@ export type HaEntityPickerEntityFilterFunc = (entityId: HassEntity) => boolean;
class HaEntityAttributePicker extends LitElement {
@property({ attribute: false }) public hass!: HomeAssistant;
@property() public entityId?: string;
@property({ attribute: false }) public entityId?: string;
/**
* List of attributes to be hidden.
@ -23,6 +23,7 @@ class HaEntityAttributePicker extends LitElement {
@property({ type: Array, attribute: "hide-attributes" })
public hideAttributes?: string[];
// eslint-disable-next-line lit/no-native-attributes
@property({ type: Boolean }) public autofocus = false;
@property({ type: Boolean }) public disabled = false;

5
src/components/entity/ha-entity-picker.ts
View File

@ -34,6 +34,7 @@ const CREATE_ID = "___create-new-entity___";
export class HaEntityPicker extends LitElement {
@property({ attribute: false }) public hass!: HomeAssistant;
// eslint-disable-next-line lit/no-native-attributes
@property({ type: Boolean }) public autofocus = false;
@property({ type: Boolean }) public disabled = false;
@ -49,7 +50,7 @@ export class HaEntityPicker extends LitElement {
@property() public helper?: string;
@property({ type: Array }) public createDomains?: string[];
@property({ attribute: false, type: Array }) public createDomains?: string[];
/**
* Show entities from specific domains.
@ -102,7 +103,7 @@ export class HaEntityPicker extends LitElement {
@property({ attribute: false })
public entityFilter?: HaEntityPickerEntityFilterFunc;
@property({ type: Boolean }) public hideClearIcon = false;
@property({ attribute: false, type: Boolean }) public hideClearIcon = false;
@property({ attribute: "item-label-path" }) public itemLabelPath =
"friendly_name";

1
src/components/entity/ha-entity-state-content-picker.ts
View File

@ -79,6 +79,7 @@ class HaEntityStatePicker extends LitElement {
@property({ attribute: false }) public entityId?: string;
// eslint-disable-next-line lit/no-native-attributes
@property({ type: Boolean }) public autofocus = false;
@property({ type: Boolean }) public disabled = false;

3
src/components/entity/ha-entity-state-picker.ts
View File

@ -14,12 +14,13 @@ export type HaEntityPickerEntityFilterFunc = (entityId: HassEntity) => boolean;
class HaEntityStatePicker extends LitElement {
@property({ attribute: false }) public hass!: HomeAssistant;
@property() public entityId?: string;
@property({ attribute: false }) public entityId?: string;
@property() public attribute?: string;
@property({ attribute: false }) public extraOptions?: any[];
// eslint-disable-next-line lit/no-native-attributes
@property({ type: Boolean }) public autofocus = false;
@property({ type: Boolean }) public disabled = false;

20
src/components/entity/ha-state-label-badge.ts
View File

@ -55,7 +55,7 @@ export class HaStateLabelBadge extends LitElement {
@property() public image?: string;
@property({ type: Boolean }) public showName = false;
@property({ attribute: false, type: Boolean }) public showName = false;
@state() private _timerTimeRemaining?: number;
@ -66,13 +66,13 @@ export class HaStateLabelBadge extends LitElement {
public connectedCallback(): void {
super.connectedCallback();
this._connected = true;
this.startInterval(this.state);
this._startInterval(this.state);
}
public disconnectedCallback(): void {
super.disconnectedCallback();
this._connected = false;
this.clearInterval();
this._clearInterval();
}
protected render(): TemplateResult {
@ -151,7 +151,7 @@ export class HaStateLabelBadge extends LitElement {
super.updated(changedProperties);
if (this._connected && changedProperties.has("state")) {
this.startInterval(this.state);
this._startInterval(this.state);
}
}
@ -237,28 +237,28 @@ export class HaStateLabelBadge extends LitElement {
return entityState.attributes.unit_of_measurement || null;
}
private clearInterval() {
private _clearInterval() {
if (this._updateRemaining) {
clearInterval(this._updateRemaining);
this._updateRemaining = undefined;
}
}
private startInterval(stateObj) {
this.clearInterval();
private _startInterval(stateObj) {
this._clearInterval();
if (stateObj && computeStateDomain(stateObj) === "timer") {
this.calculateTimerRemaining(stateObj);
this._calculateTimerRemaining(stateObj);
if (stateObj.state === "active") {
this._updateRemaining = window.setInterval(
() => this.calculateTimerRemaining(this.state),
() => this._calculateTimerRemaining(this.state),
1000
);
}
}
}
private calculateTimerRemaining(stateObj) {
private _calculateTimerRemaining(stateObj) {
this._timerTimeRemaining = timerTimeRemaining(stateObj);
}

6
src/components/entity/ha-statistic-picker.ts
View File

@ -39,7 +39,8 @@ export class HaStatisticPicker extends LitElement {
@property({ type: Boolean, attribute: "allow-custom-entity" })
public allowCustomEntity;
@property({ type: Array }) public statisticIds?: StatisticsMetaData[];
@property({ attribute: false, type: Array })
public statisticIds?: StatisticsMetaData[];
@property({ type: Boolean }) public disabled = false;
@ -84,7 +85,8 @@ export class HaStatisticPicker extends LitElement {
@property({ type: Array, attribute: "exclude-statistics" })
public excludeStatistics?: string[];
@property() public helpMissingEntityUrl = "/more-info/statistics/";
@property({ attribute: false }) public helpMissingEntityUrl =
"/more-info/statistics/";
@state() private _opened?: boolean;

2
src/components/entity/ha-statistics-picker.ts
View File

@ -12,7 +12,7 @@ class HaStatisticsPicker extends LitElement {
@property({ type: Array }) public value?: string[];
@property({ type: Array }) public statisticIds?: string[];
@property({ attribute: false, type: Array }) public statisticIds?: string[];
@property({ attribute: "statistic-types" })
public statisticTypes?: "mean" | "sum";

4
src/components/entity/state-badge.ts
View File

@ -22,9 +22,9 @@ export class StateBadge extends LitElement {
@property({ attribute: false }) public stateObj?: HassEntity;
@property() public overrideIcon?: string;
@property({ attribute: false }) public overrideIcon?: string;
@property() public overrideImage?: string;
@property({ attribute: false }) public overrideImage?: string;
// Cannot be a boolean attribute because undefined is treated different than
// false. When it is undefined, state is still colored for light entities.

2
src/components/entity/state-info.ts
View File

@ -14,7 +14,7 @@ class StateInfo extends LitElement {
@property({ attribute: false }) public stateObj?: HassEntity;
@property({ type: Boolean }) public inDialog = false;
@property({ attribute: false, type: Boolean }) public inDialog = false;
@property() public color?: string;

5
src/components/ha-alert.ts
View File

@ -27,6 +27,7 @@ declare global {
@customElement("ha-alert")
class HaAlert extends LitElement {
// eslint-disable-next-line lit/no-native-attributes
@property() public title = "";
@property({ attribute: "alert-type" }) public alertType:
@ -63,7 +64,7 @@ class HaAlert extends LitElement {
<slot name="action">
${this.dismissable
? html`<ha-icon-button
@click=${this._dismiss_clicked}
@click=${this._dismissClicked}
label="Dismiss alert"
.path=${mdiClose}
></ha-icon-button>`
@ -75,7 +76,7 @@ class HaAlert extends LitElement {
`;
}
private _dismiss_clicked() {
private _dismissClicked() {
fireEvent(this, "alert-dismissed-clicked");
}

2
src/components/ha-assist-pipeline-picker.ts
View File

@ -26,7 +26,7 @@ export class HaAssistPipelinePicker extends LitElement {
@property({ type: Boolean }) public required = false;
@property({ type: Boolean }) public includeLastUsed = false;
@property({ attribute: false, type: Boolean }) public includeLastUsed = false;
@state() _pipelines?: AssistPipeline[];

2
src/components/ha-attribute-icon.ts
View File

@ -15,7 +15,7 @@ export class HaAttributeIcon extends LitElement {
@property() public attribute?: string;
@property() public attributeValue?: string;
@property({ attribute: false }) public attributeValue?: string;
@property() public icon?: string;

8
src/components/ha-attributes.ts
View File

@ -20,7 +20,7 @@ class HaAttributes extends LitElement {
@state() private _expanded = false;
private get _filteredAttributes() {
return this.computeDisplayAttributes(
return this._computeDisplayAttributes(
STATE_ATTRIBUTES.concat(
this.extraFilters ? this.extraFilters.split(",") : []
)
@ -53,7 +53,7 @@ class HaAttributes extends LitElement {
"ui.components.attributes.expansion_header"
)}
outlined
@expanded-will-change=${this.expandedChanged}
@expanded-will-change=${this._expandedChanged}
>
<div class="attribute-container">
${this._expanded
@ -128,7 +128,7 @@ class HaAttributes extends LitElement {
];
}
private computeDisplayAttributes(filtersArray: string[]): string[] {
private _computeDisplayAttributes(filtersArray: string[]): string[] {
if (!this.stateObj) {
return [];
}
@ -137,7 +137,7 @@ class HaAttributes extends LitElement {
);
}
private expandedChanged(ev) {
private _expandedChanged(ev) {
this._expanded = ev.detail.expanded;
}
}

22
src/components/ha-base-time-input.ts
View File

@ -36,7 +36,7 @@ export class HaBaseTimeInput extends LitElement {
/**
* auto validate time inputs
*/
@property({ type: Boolean }) autoValidate = false;
@property({ attribute: false, type: Boolean }) autoValidate = false;
/**
* determines if inputs are required
@ -81,52 +81,52 @@ export class HaBaseTimeInput extends LitElement {
/**
* Label for the day input
*/
@property() dayLabel = "";
@property({ attribute: false }) dayLabel = "";
/**
* Label for the hour input
*/
@property() hourLabel = "";
@property({ attribute: false }) hourLabel = "";
/**
* Label for the min input
*/
@property() minLabel = "";
@property({ attribute: false }) minLabel = "";
/**
* Label for the sec input
*/
@property() secLabel = "";
@property({ attribute: false }) secLabel = "";
/**
* Label for the milli sec input
*/
@property() millisecLabel = "";
@property({ attribute: false }) millisecLabel = "";
/**
* show the sec field
*/
@property({ type: Boolean }) enableSecond = false;
@property({ attribute: false, type: Boolean }) enableSecond = false;
/**
* show the milli sec field
*/
@property({ type: Boolean }) enableMillisecond = false;
@property({ attribute: false, type: Boolean }) enableMillisecond = false;
/**
* show the day field
*/
@property({ type: Boolean }) enableDay = false;
@property({ attribute: false, type: Boolean }) enableDay = false;
/**
* limit hours input
*/
@property({ type: Boolean }) noHoursLimit = false;
@property({ attribute: false, type: Boolean }) noHoursLimit = false;
/**
* AM or PM
*/
@property() amPm: "AM" | "PM" = "AM";
@property({ attribute: false }) amPm: "AM" | "PM" = "AM";
@property({ type: Boolean, reflect: true }) public clearable?: boolean;

2
src/components/ha-button-menu.ts
View File

@ -14,7 +14,7 @@ export class HaButtonMenu extends LitElement {
@property() public corner: Corner = "BOTTOM_START";
@property() public menuCorner: MenuCorner = "START";
@property({ attribute: false }) public menuCorner: MenuCorner = "START";
@property({ type: Number }) public x: number | null = null;

2
src/components/ha-button-toggle-group.ts
View File

@ -14,7 +14,7 @@ export class HaButtonToggleGroup extends LitElement {
@property() public active?: string;
@property({ type: Boolean }) public fullWidth = false;
@property({ attribute: false, type: Boolean }) public fullWidth = false;
@property({ type: Boolean }) public dense = false;

10
src/components/ha-clickable-list-item.ts
View File

@ -7,9 +7,10 @@ import { HaListItem } from "./ha-list-item";
export class HaClickableListItem extends HaListItem {
@property() public href?: string;
@property({ type: Boolean }) public disableHref = false;
@property({ attribute: false, type: Boolean }) public disableHref = false;
@property({ type: Boolean, reflect: true }) public openNewTab = false;
@property({ attribute: false, type: Boolean, reflect: true })
public openNewTab = false;
@query("a") private _anchor!: HTMLAnchorElement;
@ -18,7 +19,7 @@ export class HaClickableListItem extends HaListItem {
const href = this.href || "";
return html`${this.disableHref
? html`<a>${r}</a>`
? html`<a href="#" class="disabled">${r}</a>`
: html`<a target=${this.openNewTab ? "_blank" : ""} href=${href}
>${r}</a
>`}`;
@ -44,6 +45,9 @@ export class HaClickableListItem extends HaListItem {
align-items: center;
overflow: hidden;
}
.disabled {
pointer-events: none;
}
`,
];
}

3
src/components/ha-code-editor.ts
View File

@ -44,9 +44,10 @@ export class HaCodeEditor extends ReactiveElement {
public hass?: HomeAssistant;
// eslint-disable-next-line lit/no-native-attributes
@property({ type: Boolean }) public autofocus = false;
@property({ type: Boolean }) public readOnly = false;
@property({ attribute: false, type: Boolean }) public readOnly = false;
@property({ type: Boolean }) public linewrap = false;

8
src/components/ha-color-picker.ts
View File

@ -82,7 +82,7 @@ export class HaColorPicker extends LitElement {
`
: value === "state"
? html`<ha-svg-icon path=${mdiPalette}></ha-svg-icon>`
: this.renderColorCircle(value || "grey")}
: this._renderColorCircle(value || "grey")}
</span>
`
: nothing}
@ -123,7 +123,7 @@ export class HaColorPicker extends LitElement {
${this.defaultColor === color
? ` (${this.hass.localize("ui.components.color-picker.default")})`
: nothing}
<span slot="graphic">${this.renderColorCircle(color)}</span>
<span slot="graphic">${this._renderColorCircle(color)}</span>
</ha-list-item>
`
)}
@ -131,7 +131,7 @@ export class HaColorPicker extends LitElement {
? html`
<ha-list-item .value=${value} graphic="icon">
${value}
<span slot="graphic">${this.renderColorCircle(value)}</span>
<span slot="graphic">${this._renderColorCircle(value)}</span>
</ha-list-item>
`
: nothing}
@ -139,7 +139,7 @@ export class HaColorPicker extends LitElement {
`;
}
private renderColorCircle(color: string) {
private _renderColorCircle(color: string) {
return html`
<span
class="circle-color"

2
src/components/ha-combo-box.ts
View File

@ -71,7 +71,7 @@ export class HaComboBox extends LitElement {
@property() public placeholder?: string;
@property() public validationMessage?: string;
@property({ attribute: false }) public validationMessage?: string;
@property() public helper?: string;

2
src/components/ha-control-circular-slider.ts
View File

@ -435,7 +435,7 @@ export class HaControlCircularSlider extends LitElement {
this._activeSlider = undefined;
}
_handleKeyUp(e: KeyboardEvent) {
private _handleKeyUp(e: KeyboardEvent) {
if (!A11Y_KEY_CODES.has(e.code)) return;
this._activeSlider = (e.currentTarget as any).id as ActiveSlider;
e.preventDefault();

12
src/components/ha-control-number-buttons.ts
View File

@ -52,7 +52,7 @@ export class HaControlNumberButton extends LitElement {
},
});
private boundedValue(value: number) {
private _boundedValue(value: number) {
const clamped = conditionalClamp(value, this.min, this.max);
return Math.round(clamped / this._step) * this._step;
}
@ -86,14 +86,14 @@ export class HaControlNumberButton extends LitElement {
}
private _increment() {
this.value = this.boundedValue(this._value + this._step);
this.value = this._boundedValue(this._value + this._step);
}
private _decrement() {
this.value = this.boundedValue(this._value - this._step);
this.value = this._boundedValue(this._value - this._step);
}
_handleKeyDown(e: KeyboardEvent) {
private _handleKeyDown(e: KeyboardEvent) {
if (this.disabled) return;
if (!A11Y_KEY_CODES.has(e.code)) return;
e.preventDefault();
@ -107,10 +107,10 @@ export class HaControlNumberButton extends LitElement {
this._decrement();
break;
case "PageUp":
this.value = this.boundedValue(this._value + this._tenPercentStep);
this.value = this._boundedValue(this._value + this._tenPercentStep);
break;
case "PageDown":
this.value = this.boundedValue(this._value - this._tenPercentStep);
this.value = this._boundedValue(this._value - this._tenPercentStep);
break;
case "Home":
if (this.min != null) {

9
src/components/ha-control-select-menu.ts
View File

@ -57,12 +57,13 @@ export class HaControlSelectMenu extends SelectBase {
aria-labelledby=${ifDefined(labelledby)}
aria-label=${ifDefined(labelAttribute)}
aria-required=${this.required}
aria-controls="listbox"
@focus=${this.onFocus}
@blur=${this.onBlur}
@click=${this.onClick}
@keydown=${this.onKeydown}
>
${this.renderIcon()}
${this._renderIcon()}
<div class="content">
${this.hideLabel
? nothing
@ -71,7 +72,7 @@ export class HaControlSelectMenu extends SelectBase {
? html`<p class="value">${this.selectedText}</p>`
: nothing}
</div>
${this.renderArrow()}
${this._renderArrow()}
<ha-ripple .disabled=${this.disabled}></ha-ripple>
</div>
${this.renderMenu()}
@ -79,7 +80,7 @@ export class HaControlSelectMenu extends SelectBase {
`;
}
private renderArrow() {
private _renderArrow() {
if (!this.showArrow) return nothing;
return html`
@ -89,7 +90,7 @@ export class HaControlSelectMenu extends SelectBase {
`;
}
private renderIcon() {
private _renderIcon() {
const index = this.mdcFoundation?.getSelectedIndex();
const items = this.menuElement?.items ?? [];
const item = index != null ? items[index] : undefined;

8
src/components/ha-control-slider.ts
View File

@ -215,12 +215,12 @@ export class HaControlSlider extends LitElement {
return Math.max(this.step, (this.max - this.min) / 10);
}
_showTooltip() {
private _showTooltip() {
if (this._tooltipTimeout != null) window.clearTimeout(this._tooltipTimeout);
this.tooltipVisible = true;
}
_hideTooltip(delay?: number) {
private _hideTooltip(delay?: number) {
if (!delay) {
this.tooltipVisible = false;
return;
@ -230,7 +230,7 @@ export class HaControlSlider extends LitElement {
}, delay);
}
_handleKeyDown(e: KeyboardEvent) {
private _handleKeyDown(e: KeyboardEvent) {
if (!A11Y_KEY_CODES.has(e.code)) return;
e.preventDefault();
switch (e.code) {
@ -265,7 +265,7 @@ export class HaControlSlider extends LitElement {
private _tooltipTimeout?: number;
_handleKeyUp(e: KeyboardEvent) {
private _handleKeyUp(e: KeyboardEvent) {
if (!A11Y_KEY_CODES.has(e.code)) return;
e.preventDefault();
this._hideTooltip(500);

4
src/components/ha-control-switch.ts
View File

@ -22,10 +22,10 @@ export class HaControlSwitch extends LitElement {
@property({ type: Boolean, reflect: true }) public checked = false;
// SVG icon path (if you need a non SVG icon instead, use the provided on icon slot to pass an <ha-icon slot="icon-on"> in)
@property({ type: String }) pathOn?: string;
@property({ attribute: false, type: String }) pathOn?: string;
// SVG icon path (if you need a non SVG icon instead, use the provided off icon slot to pass an <ha-icon slot="icon-off"> in)
@property({ type: String }) pathOff?: string;
@property({ attribute: false, type: String }) pathOff?: string;
@property({ attribute: "touch-action" })
public touchAction?: string;

2
src/components/ha-country-picker.ts
View File

@ -277,7 +277,7 @@ export class HaCountryPicker extends LitElement {
@property({ type: Boolean, reflect: true }) public disabled = false;
@property({ type: Boolean }) public noSort = false;
@property({ attribute: false, type: Boolean }) public noSort = false;
private _getOptions = memoizeOne(
(language?: string, countries?: string[]) => {

6
src/components/ha-date-input.ts
View File

@ -13,7 +13,7 @@ import "./ha-textfield";
const loadDatePickerDialog = () => import("./ha-dialog-date-picker");
export interface datePickerDialogParams {
export interface DatePickerDialogParams {
value?: string;
min?: string;
max?: string;
@ -25,7 +25,7 @@ export interface datePickerDialogParams {
const showDatePickerDialog = (
element: HTMLElement,
dialogParams: datePickerDialogParams
dialogParams: DatePickerDialogParams
): void => {
fireEvent(element, "show-dialog", {
dialogTag: "ha-dialog-date-picker",
@ -51,7 +51,7 @@ export class HaDateInput extends LitElement {
@property() public helper?: string;
@property({ type: Boolean }) public canClear = false;
@property({ attribute: false, type: Boolean }) public canClear = false;
render() {
return html`<ha-textfield

14
src/components/ha-date-range-picker.ts
View File

@ -53,19 +53,23 @@ export class HaDateRangePicker extends LitElement {
@state() private _ranges?: DateRangePickerRanges;
@property({ type: Boolean }) public autoApply = false;
@property({ attribute: false, type: Boolean }) public autoApply = false;
@property({ type: Boolean }) public timePicker = true;
@property({ attribute: false, type: Boolean }) public timePicker = true;
@property({ type: Boolean }) public disabled = false;
@property({ attribute: false, type: Boolean }) public disabled = false;
@property({ type: Boolean }) public minimal = false;
@state() private _hour24format = false;
@property({ type: Boolean }) public extendedPresets = false;
@property({ attribute: false, type: Boolean }) public extendedPresets = false;
@property() public openingDirection?: "right" | "left" | "center" | "inline";
@property({ attribute: false }) public openingDirection?:
| "right"
| "left"
| "center"
| "inline";
@state() private _calcedOpeningDirection?:
| "right"

6
src/components/ha-dialog-date-picker.ts
View File

@ -7,7 +7,7 @@ import { fireEvent } from "../common/dom/fire_event";
import { nextRender } from "../common/util/render-status";
import { haStyleDialog } from "../resources/styles";
import type { HomeAssistant } from "../types";
import type { datePickerDialogParams } from "./ha-date-input";
import type { DatePickerDialogParams } from "./ha-date-input";
import "./ha-dialog";
@customElement("ha-dialog-date-picker")
@ -20,11 +20,11 @@ export class HaDialogDatePicker extends LitElement {
@property() public label?: string;
@state() private _params?: datePickerDialogParams;
@state() private _params?: DatePickerDialogParams;
@state() private _value?: string;
public async showDialog(params: datePickerDialogParams): Promise<void> {
public async showDialog(params: DatePickerDialogParams): Promise<void> {
// app-datepicker has a bug, that it removes its handlers when disconnected, but doesn't add them back when reconnected.
// So we need to wait for the next render to make sure the element is removed and re-created so the handlers are added.
await nextRender();

4
src/components/ha-domain-icon.ts
View File

@ -14,11 +14,11 @@ export class HaDomainIcon extends LitElement {
@property() public domain?: string;
@property() public deviceClass?: string;
@property({ attribute: false }) public deviceClass?: string;
@property() public icon?: string;
@property({ type: Boolean }) public brandFallback?: boolean;
@property({ attribute: false, type: Boolean }) public brandFallback?: boolean;
protected render() {
if (this.icon) {

5
src/components/ha-duration-input.ts
View File

@ -23,9 +23,10 @@ class HaDurationInput extends LitElement {
@property({ type: Boolean }) public required = false;
@property({ type: Boolean }) public enableMillisecond = false;
@property({ attribute: false, type: Boolean }) public enableMillisecond =
false;
@property({ type: Boolean }) public enableDay = false;
@property({ attribute: false, type: Boolean }) public enableDay = false;
@property({ type: Boolean }) public disabled = false;

6
src/components/ha-expansion-panel.ts
View File

@ -13,9 +13,11 @@ export class HaExpansionPanel extends LitElement {
@property({ type: Boolean, reflect: true }) outlined = false;
@property({ type: Boolean, reflect: true }) leftChevron = false;
@property({ attribute: false, type: Boolean, reflect: true }) leftChevron =
false;
@property({ type: Boolean, reflect: true }) noCollapse = false;
@property({ attribute: false, type: Boolean, reflect: true }) noCollapse =
false;
@property() header?: string;

3
src/components/ha-form/ha-form-string.ts
View File

@ -22,7 +22,8 @@ const MASKED_FIELDS = ["password", "secret", "token"];
export class HaFormString extends LitElement implements HaFormElement {
@property({ attribute: false }) public localize?: LocalizeFunc;
@property() public localizeBaseKey = "ui.components.selectors.text";
@property({ attribute: false }) public localizeBaseKey =
"ui.components.selectors.text";
@property({ attribute: false }) public schema!: HaFormStringSchema;

14
src/components/ha-gauge.ts
View File

@ -30,7 +30,7 @@ export class HaGauge extends LitElement {
@property({ attribute: false })
public formatOptions?: Intl.NumberFormatOptions;
@property({ type: String }) public valueText?: string;
@property({ attribute: false, type: String }) public valueText?: string;
@property({ attribute: false }) public locale!: FrontendLocaleData;
@ -52,8 +52,8 @@ export class HaGauge extends LitElement {
afterNextRender(() => {
this._updated = true;
this._angle = getAngle(this.value, this.min, this.max);
this._segment_label = this.getSegmentLabel();
this._rescale_svg();
this._segment_label = this._getSegmentLabel();
this._rescaleSvg();
});
}
@ -68,8 +68,8 @@ export class HaGauge extends LitElement {
return;
}
this._angle = getAngle(this.value, this.min, this.max);
this._segment_label = this.getSegmentLabel();
this._rescale_svg();
this._segment_label = this._getSegmentLabel();
this._rescaleSvg();
}
protected render() {
@ -149,7 +149,7 @@ export class HaGauge extends LitElement {
</svg>`;
}
private _rescale_svg() {
private _rescaleSvg() {
// Set the viewbox of the SVG containing the value to perfectly
// fit the text
// That way it will auto-scale correctly
@ -161,7 +161,7 @@ export class HaGauge extends LitElement {
);
}
private getSegmentLabel() {
private _getSegmentLabel() {
if (this.levels) {
this.levels.sort((a, b) => a.level - b.level);
for (let i = this.levels.length - 1; i >= 0; i--) {

2
src/components/ha-grid-size-picker.ts
View File

@ -149,7 +149,7 @@ export class HaGridSizeEditor extends LitElement {
`;
}
_cellClick(ev) {
private _cellClick(ev) {
const cell = ev.currentTarget as HTMLElement;
const rows = Number(cell.getAttribute("data-row"));
const columns = Number(cell.getAttribute("data-column"));

1
src/components/ha-hls-player.ts
View File

@ -139,6 +139,7 @@ class HaHLSPlayer extends LitElement {
private async _startHls(): Promise<void> {
const masterPlaylistPromise = fetch(this._url);
// eslint-disable-next-line @typescript-eslint/naming-convention
const Hls: typeof HlsType = (await import("hls.js/dist/hls.light.mjs"))
.default;

14
src/components/ha-hs-color-picker.ts
View File

@ -119,7 +119,7 @@ class HaHsColorPicker extends LitElement {
@property({ type: Array })
public value?: [number, number];
@property({ type: Number })
@property({ attribute: false, type: Number })
public colorBrightness?: number;
@property({ type: Number })
@ -131,10 +131,10 @@ class HaHsColorPicker extends LitElement {
@property({ type: Number })
public ww?: number;
@property({ type: Number })
@property({ attribute: false, type: Number })
public minKelvin?: number;
@property({ type: Number })
@property({ attribute: false, type: Number })
public maxKelvin?: number;
@query("#canvas") private _canvas!: HTMLCanvasElement;
@ -201,7 +201,7 @@ class HaHsColorPicker extends LitElement {
}
}
_setupListeners() {
private _setupListeners() {
if (this._canvas && !this._mc) {
this._mc = new Manager(this._canvas);
this._mc.add(
@ -292,11 +292,11 @@ class HaHsColorPicker extends LitElement {
const _y = (2 * (y - offsetY)) / maxY - 1;
const [r, phi] = xy2polar(_x, _y);
const [__x, __y] = polar2xy(Math.min(1, r), phi);
return [__x, __y];
const [xx, yy] = polar2xy(Math.min(1, r), phi);
return [xx, yy];
};
_destroyListeners() {
private _destroyListeners() {
if (this._mc) {
this._mc.destroy();
this._mc = undefined;

2
src/components/ha-icon-button.ts
View File

@ -21,7 +21,7 @@ export class HaIconButton extends LitElement {
@property({ type: String, attribute: "aria-haspopup" })
override ariaHasPopup!: IconButton["ariaHasPopup"];
@property({ type: Boolean }) hideTitle = false;
@property({ attribute: false, type: Boolean }) hideTitle = false;
@query("mwc-icon-button", true) private _button?: IconButton;

6
src/components/ha-language-picker.ts
View File

@ -27,11 +27,11 @@ export class HaLanguagePicker extends LitElement {
@property({ type: Boolean }) public required = false;
@property({ type: Boolean }) public nativeName = false;
@property({ attribute: false, type: Boolean }) public nativeName = false;
@property({ type: Boolean }) public noSort = false;
@property({ attribute: false, type: Boolean }) public noSort = false;
@property({ type: Boolean }) public inlineArrow = false;
@property({ attribute: false, type: Boolean }) public inlineArrow = false;
@state() _defaultLanguages: string[] = [];

2
src/components/ha-markdown-element.ts
View File

@ -19,7 +19,7 @@ const _gitHubMarkdownAlerts = {
class HaMarkdownElement extends ReactiveElement {
@property() public content?;
@property({ type: Boolean }) public allowSvg = false;
@property({ attribute: false, type: Boolean }) public allowSvg = false;
@property({ type: Boolean }) public breaks = false;

2
src/components/ha-markdown.ts
View File

@ -7,7 +7,7 @@ import "./ha-markdown-element";
export class HaMarkdown extends LitElement {
@property() public content?;
@property({ type: Boolean }) public allowSvg = false;
@property({ attribute: false, type: Boolean }) public allowSvg = false;
@property({ type: Boolean }) public breaks = false;

2
src/components/ha-md-dialog.ts
View File

@ -116,7 +116,7 @@ export class HaMdDialog extends MdDialog {
});
}
_handleCancel(closeEvent: Event) {
private _handleCancel(closeEvent: Event) {
if (this.disableCancelAction) {
closeEvent.preventDefault();
const dialogElement = this.shadowRoot?.querySelector("dialog .container");

9
src/components/ha-mount-picker.ts
View File

@ -18,7 +18,7 @@ import "./ha-list-item";
import "./ha-select";
import type { HaSelect } from "./ha-select";
const __BACKUP_DATA_DISK__ = "/backup";
const _BACKUP_DATA_DISK_ = "/backup";
@customElement("ha-mount-picker")
class HaMountPicker extends LitElement {
@ -53,7 +53,7 @@ class HaMountPicker extends LitElement {
}
const dataDiskOption = html`<ha-list-item
graphic="icon"
.value=${__BACKUP_DATA_DISK__}
.value=${_BACKUP_DATA_DISK_}
>
<span>
${this.hass.localize("ui.components.mount-picker.use_datadisk") ||
@ -77,7 +77,7 @@ class HaMountPicker extends LitElement {
>
${this.usage === SupervisorMountUsage.BACKUP &&
(!this._mounts.default_backup_mount ||
this._mounts.default_backup_mount === __BACKUP_DATA_DISK__)
this._mounts.default_backup_mount === _BACKUP_DATA_DISK_)
? dataDiskOption
: nothing}
${this._filterMounts(this._mounts, this.usage).map(
@ -138,8 +138,7 @@ class HaMountPicker extends LitElement {
if (isComponentLoaded(this.hass, "hassio")) {
this._mounts = await fetchSupervisorMounts(this.hass);
if (this.usage === SupervisorMountUsage.BACKUP && !this.value) {
this.value =
this._mounts.default_backup_mount || __BACKUP_DATA_DISK__;
this.value = this._mounts.default_backup_mount || _BACKUP_DATA_DISK_;
}
} else {
this._error = this.hass.localize(

12
src/components/ha-multi-textfield.ts
View File

@ -20,17 +20,17 @@ class HaMultiTextField extends LitElement {
@property() public label?: string;
@property() public inputType?: string;
@property({ attribute: false }) public inputType?: string;
@property() public inputSuffix?: string;
@property({ attribute: false }) public inputSuffix?: string;
@property() public inputPrefix?: string;
@property({ attribute: false }) public inputPrefix?: string;
@property() public autocomplete?: string;
@property({ attribute: false }) public autocomplete?: string;
@property() public addLabel?: string;
@property({ attribute: false }) public addLabel?: string;
@property() public removeLabel?: string;
@property({ attribute: false }) public removeLabel?: string;
@property({ attribute: "item-index", type: Boolean })
public itemIndex = false;

2
src/components/ha-navigation-list.ts
View File

@ -19,7 +19,7 @@ class HaNavigationList extends LitElement {
@property({ attribute: false }) public pages!: PageNavigation[];
@property({ type: Boolean }) public hasSecondary = false;
@property({ attribute: false, type: Boolean }) public hasSecondary = false;
@property() public label?: string;

27
src/components/ha-password-field.ts
View File

@ -23,7 +23,7 @@ export class HaPasswordField extends LitElement {
@property({ type: Boolean }) public icon = false;
@property({ type: Boolean }) public iconTrailing = false;
@property({ attribute: false, type: Boolean }) public iconTrailing = false;
@property() public autocomplete?: string;
@ -42,30 +42,32 @@ export class HaPasswordField extends LitElement {
@property({ type: Boolean }) required = false;
@property({ type: Number }) minLength = -1;
@property({ attribute: false, type: Number }) minLength = -1;
@property({ type: Number }) maxLength = -1;
@property({ attribute: false, type: Number }) maxLength = -1;
@property({ type: Boolean, reflect: true }) outlined = false;
@property({ type: String }) helper = "";
@property({ type: Boolean }) validateOnInitialRender = false;
@property({ attribute: false, type: Boolean }) validateOnInitialRender =
false;
@property({ type: String }) validationMessage = "";
@property({ attribute: false, type: String }) validationMessage = "";
@property({ type: Boolean }) autoValidate = false;
@property({ attribute: false, type: Boolean }) autoValidate = false;
@property({ type: String }) pattern = "";
@property({ type: Number }) size: number | null = null;
@property({ type: Boolean }) helperPersistent = false;
@property({ attribute: false, type: Boolean }) helperPersistent = false;
@property({ type: Boolean }) charCounter: boolean | TextAreaCharCounter =
false;
@property({ attribute: false, type: Boolean }) charCounter:
| boolean
| TextAreaCharCounter = false;
@property({ type: Boolean }) endAligned = false;
@property({ attribute: false, type: Boolean }) endAligned = false;
@property({ type: String }) prefix = "";
@ -76,9 +78,10 @@ export class HaPasswordField extends LitElement {
@property({ type: String, attribute: "input-mode" })
inputMode!: string;
@property({ type: Boolean }) readOnly = false;
@property({ attribute: false, type: Boolean }) readOnly = false;
@property({ type: String }) autocapitalize = "";
// eslint-disable-next-line lit/no-native-attributes
@property({ attribute: false, type: String }) autocapitalize = "";
@state() private _unmaskedPassword = false;

2
src/components/ha-picture-upload.ts
View File

@ -25,7 +25,7 @@ export class HaPictureUpload extends LitElement {
@property() public supports?: string;
@property() public currentImageAltText?: string;
@property({ attribute: false }) public currentImageAltText?: string;
@property({ type: Boolean }) public crop = false;

11
src/components/ha-qr-code.ts
View File

@ -22,15 +22,8 @@ export class HaQrCode extends LitElement {
@property({ type: Number })
public margin = 4;
@property({ type: Number }) public maskPattern?:
| 0
| 1
| 2
| 3
| 4
| 5
| 6
| 7;
@property({ attribute: false, type: Number })
public maskPattern?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7;
@property({ attribute: "center-image" }) public centerImage?: string;

1
src/components/ha-qr-scanner.ts
View File

@ -160,6 +160,7 @@ class HaQrScanner extends LitElement {
if (!navigator.mediaDevices) {
return;
}
// eslint-disable-next-line @typescript-eslint/naming-convention
const QrScanner = (await import("qr-scanner")).default;
if (!(await QrScanner.hasCamera())) {
this._reportError("No camera found");

4
src/components/ha-related-items.ts
View File

@ -30,9 +30,9 @@ import "./ha-switch";
export class HaRelatedItems extends LitElement {
@property({ attribute: false }) public hass!: HomeAssistant;
@property() public itemType!: ItemType;
@property({ attribute: false }) public itemType!: ItemType;
@property() public itemId!: string;
@property({ attribute: false }) public itemId!: string;
@state() private _entries?: ConfigEntry[];

4
src/components/ha-ripple.ts
View File

@ -7,7 +7,7 @@ import { customElement } from "lit/decorators";
export class HaRipple extends MdRipple {
private readonly attachableTouchController = new AttachableController(
this,
this.onTouchControlChange.bind(this)
this._onTouchControlChange.bind(this)
);
attach(control: HTMLElement) {
@ -27,7 +27,7 @@ export class HaRipple extends MdRipple {
}
};
private onTouchControlChange(
private _onTouchControlChange(
prev: HTMLElement | null,
next: HTMLElement | null
) {

2
src/components/ha-select.ts
View File

@ -14,7 +14,7 @@ export class HaSelect extends SelectBase {
@property({ type: Boolean, reflect: true }) public clearable = false;
@property({ type: Boolean }) public inlineArrow = false;
@property({ attribute: false, type: Boolean }) public inlineArrow = false;
protected override render() {
return html`

7
src/components/ha-service-control.ts
View File

@ -86,11 +86,12 @@ export class HaServiceControl extends LitElement {
@property({ type: Boolean, reflect: true }) public narrow = false;
@property({ type: Boolean }) public showAdvanced = false;
@property({ attribute: false, type: Boolean }) public showAdvanced = false;
@property({ type: Boolean, reflect: true }) public hidePicker = false;
@property({ attribute: false, type: Boolean, reflect: true })
public hidePicker = false;
@property({ type: Boolean }) public hideDescription = false;
@property({ attribute: false, type: Boolean }) public hideDescription = false;
@state() private _value!: this["value"];

21
src/components/ha-sidebar.ts
View File

@ -184,9 +184,9 @@ class HaSidebar extends SubscribeMixin(LitElement) {
@property({ attribute: false }) public route!: Route;
@property({ type: Boolean }) public alwaysExpand = false;
@property({ attribute: false, type: Boolean }) public alwaysExpand = false;
@property({ type: Boolean }) public editMode = false;
@property({ attribute: false, type: Boolean }) public editMode = false;
@state() private _notifications?: PersistentNotification[];
@ -284,10 +284,10 @@ class HaSidebar extends SubscribeMixin(LitElement) {
protected firstUpdated(changedProps: PropertyValues) {
super.firstUpdated(changedProps);
this.subscribePersistentNotifications();
this._subscribePersistentNotifications();
}
private subscribePersistentNotifications(): void {
private _subscribePersistentNotifications(): void {
if (this._unsubPersistentNotifications) {
this._unsubPersistentNotifications();
}
@ -316,7 +316,7 @@ class HaSidebar extends SubscribeMixin(LitElement) {
changedProps.get("hass")?.connected === false &&
this.hass.connected === true
) {
this.subscribePersistentNotifications();
this._subscribePersistentNotifications();
}
this._calculateCounts();
@ -441,6 +441,7 @@ class HaSidebar extends SubscribeMixin(LitElement) {
: html`
<a
role="option"
aria-selected=${urlPath === this.hass.panelUrl}
href=${`/${urlPath}`}
data-panel=${urlPath}
tabindex="-1"
@ -556,13 +557,18 @@ class HaSidebar extends SubscribeMixin(LitElement) {
return html`<a
class="configuration-container"
role="option"
aria-selected=${this.hass.panelUrl === "config"}
href="/config"
data-panel="config"
tabindex="-1"
@mouseenter=${this._itemMouseEnter}
@mouseleave=${this._itemMouseLeave}
>
<paper-icon-item class="configuration" role="option">
<paper-icon-item
class="configuration"
role="option"
aria-selected=${this.hass.panelUrl === "config"}
>
<ha-svg-icon slot="item-icon" .path=${mdiCog}></ha-svg-icon>
${!this.alwaysExpand &&
(this._updatesCount > 0 || this._issuesCount > 0)
@ -597,6 +603,7 @@ class HaSidebar extends SubscribeMixin(LitElement) {
<paper-icon-item
class="notifications"
role="option"
aria-selected="false"
@click=${this._handleShowNotificationDrawer}
>
<ha-svg-icon slot="item-icon" .path=${mdiBell}></ha-svg-icon>
@ -628,6 +635,7 @@ class HaSidebar extends SubscribeMixin(LitElement) {
data-panel="panel"
tabindex="-1"
role="option"
aria-selected=${this.hass.panelUrl === "profile"}
aria-label=${this.hass.localize("panel.profile")}
@mouseenter=${this._itemMouseEnter}
@mouseleave=${this._itemMouseLeave}
@ -657,6 +665,7 @@ class HaSidebar extends SubscribeMixin(LitElement) {
)}
href="#external-app-configuration"
tabindex="-1"
aria-selected="false"
@click=${this._handleExternalAppConfiguration}
@mouseenter=${this._itemMouseEnter}
@mouseleave=${this._itemMouseLeave}

1
src/components/ha-sortable.ts
View File

@ -132,6 +132,7 @@ export class HaSortable extends LitElement {
if (!container) return;
// eslint-disable-next-line @typescript-eslint/naming-convention
const Sortable = (await import("../resources/sortable")).default;
const options: SortableInstance.Options = {

4
src/components/ha-svg-icon.ts
View File

@ -6,9 +6,9 @@ import { customElement, property } from "lit/decorators";
export class HaSvgIcon extends LitElement {
@property() public path?: string;
@property() public secondaryPath?: string;
@property({ attribute: false }) public secondaryPath?: string;
@property() public viewBox?: string;
@property({ attribute: false }) public viewBox?: string;
protected render(): SVGTemplateResult {
return svg`

3
src/components/ha-tabs.ts
View File

@ -5,6 +5,7 @@ import type { PaperTabsElement } from "@polymer/paper-tabs/paper-tabs";
import { customElement } from "lit/decorators";
import type { Constructor } from "../types";
// eslint-disable-next-line @typescript-eslint/naming-convention
const PaperTabs = customElements.get(
"paper-tabs"
) as Constructor<PaperTabsElement>;
@ -53,6 +54,7 @@ export class HaTabs extends PaperTabs {
}
// Get first and last tab's width for _affectScroll
// eslint-disable-next-line @typescript-eslint/naming-convention
public _tabChanged(tab: PaperTabElement, old: PaperTabElement): void {
super._tabChanged(tab, old);
const tabs = this.querySelectorAll("paper-tab:not(.hide-tab)");
@ -74,6 +76,7 @@ export class HaTabs extends PaperTabs {
* while scrolling and the tab container shrinks we can counteract
* the jump in tab position so that the scroll still appears smooth.
*/
// eslint-disable-next-line @typescript-eslint/naming-convention
public _affectScroll(dx: number): void {
if (this._firstTabWidth === 0 || this._lastTabWidth === 0) {
return;

4
src/components/ha-target-picker.ts
View File

@ -58,7 +58,7 @@ export class HaTargetPicker extends SubscribeMixin(LitElement) {
@property() public helper?: string;
@property({ type: Array }) public createDomains?: string[];
@property({ attribute: false, type: Array }) public createDomains?: string[];
/**
* Show only targets with entities from specific domains.
@ -84,7 +84,7 @@ export class HaTargetPicker extends SubscribeMixin(LitElement) {
@property({ type: Boolean, reflect: true }) public disabled = false;
@property({ type: Boolean }) public addOnTop = false;
@property({ attribute: false, type: Boolean }) public addOnTop = false;
@state() private _addMode?:
| "area_id"

2
src/components/ha-textfield.ts
View File

@ -15,7 +15,7 @@ export class HaTextField extends TextFieldBase {
@property({ type: Boolean }) public icon = false;
// @ts-ignore
@property({ type: Boolean }) public iconTrailing = false;
@property({ attribute: false, type: Boolean }) public iconTrailing = false;
@property() public autocomplete?: string;

2
src/components/ha-theme-picker.ts
View File

@ -15,7 +15,7 @@ export class HaThemePicker extends LitElement {
@property() public label?: string;
@property({ type: Boolean }) includeDefault = false;
@property({ attribute: false, type: Boolean }) includeDefault = false;
@property({ attribute: false }) public hass?: HomeAssistant;

Some files were not shown because too many files have changed in this diff Show More