Fix ALL the eslint warnings

cast/src/receiver/layout/hc-lovelace.ts

@@ -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;

cast/src/receiver/layout/hc-main.ts

@@ -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);
   }
 }

eslint.config.mjs

@@ -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"],

gallery/src/components/demo-black-white-row.ts

@@ -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;

gallery/src/components/demo-card.ts

@@ -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;
 

gallery/src/components/demo-cards.ts

@@ -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,
     });

gallery/src/components/demo-more-info.ts

@@ -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);

gallery/src/components/demo-more-infos.ts

@@ -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"),
       {

gallery/src/ha-gallery.ts

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

gallery/src/pages/automation/editor-action.ts

@@ -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;
   }

gallery/src/pages/automation/editor-condition.ts

@@ -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;
   }

gallery/src/pages/automation/editor-trigger.ts

@@ -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;
   }

gallery/src/pages/automation/trace.ts

@@ -31,22 +31,17 @@ 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
                 .hass=${this.hass}
                 .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 {

gallery/src/pages/components/ha-form.ts

@@ -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 {

gallery/src/pages/components/ha-selector.ts

@@ -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;
   }