From 400ddbf625d14add8ab6eda87b66385e5870e9be Mon Sep 17 00:00:00 2001
From: Petar Petrov <MindFreeze@users.noreply.github.com>
Date: Fri, 6 Dec 2024 15:56:42 +0200
Subject: [PATCH 01/12] Fix attributes broken by the warning fixes (#23182)

---
 gallery/src/components/demo-more-info.ts            |  2 +-
 gallery/src/pages/automation/trace.ts               |  2 +-
 hassio/src/backups/hassio-backups.ts                |  2 +-
 hassio/src/dashboard/hassio-dashboard.ts            |  2 +-
 landing-page/src/ha-landing-page.ts                 |  4 ++--
 src/auth/ha-authorize.ts                            |  4 ++--
 src/components/chart/statistics-chart.ts            |  3 ++-
 src/components/ha-code-editor.ts                    |  2 +-
 src/components/ha-date-input.ts                     |  2 +-
 src/components/ha-icon-button.ts                    |  2 +-
 src/components/ha-language-picker.ts                |  8 +++++---
 src/components/ha-select.ts                         |  3 ++-
 src/components/ha-service-control.ts                |  3 ++-
 src/components/ha-target-picker.ts                  |  4 ++--
 src/components/ha-textfield.ts                      |  3 ++-
 src/components/ha-yaml-editor.ts                    | 13 ++++++++-----
 src/components/map/ha-map.ts                        |  9 +++++----
 src/components/trace/ha-trace-blueprint-config.ts   |  2 +-
 src/components/trace/ha-trace-config.ts             |  2 +-
 src/components/trace/ha-trace-path-details.ts       |  2 +-
 src/components/trace/ha-trace-timeline.ts           |  2 +-
 src/components/trace/hat-trace-timeline.ts          |  3 ++-
 src/dialogs/more-info/controls/more-info-person.ts  |  2 +-
 src/dialogs/more-info/ha-more-info-history.ts       |  3 +--
 src/dialogs/more-info/ha-more-info-info.ts          |  2 +-
 src/layouts/hass-tabs-subpage-data-table.ts         |  5 +++--
 src/onboarding/ha-onboarding.ts                     |  4 ++--
 src/panels/calendar/dialog-calendar-event-detail.ts |  2 +-
 .../ha-config-application-credentials.ts            |  2 +-
 .../config/automation/ha-automation-editor.ts       |  2 +-
 .../config/automation/ha-automation-picker.ts       |  4 ++--
 .../automation/trigger/ha-automation-trigger-row.ts |  2 +-
 src/panels/config/backup/ha-config-backup.ts        |  2 +-
 .../config/blueprint/ha-blueprint-overview.ts       |  2 +-
 src/panels/config/core/ha-config-section-general.ts |  2 +-
 .../config/devices/ha-config-devices-dashboard.ts   |  4 ++--
 src/panels/config/entities/ha-config-entities.ts    |  2 +-
 src/panels/config/helpers/ha-config-helpers.ts      |  4 ++--
 .../integration-panels/zha/zha-groups-dashboard.ts  |  2 +-
 src/panels/config/labels/ha-config-labels.ts        |  2 +-
 .../dashboards/ha-config-lovelace-dashboards.ts     |  2 +-
 src/panels/config/scene/ha-scene-dashboard.ts       |  4 ++--
 src/panels/config/script/ha-script-editor.ts        |  2 +-
 src/panels/config/script/ha-script-picker.ts        |  4 ++--
 src/panels/config/tags/ha-config-tags.ts            |  2 +-
 src/panels/config/users/ha-config-users.ts          |  2 +-
 .../debug/assist-render-pipeline-run.ts             |  4 ++--
 .../ha-config-voice-assistants-expose.ts            |  2 +-
 .../action/developer-tools-action.ts                | 10 +++++-----
 .../developer-tools/event/event-subscribe-card.ts   |  2 +-
 src/panels/lovelace/cards/hui-map-card.ts           |  4 ++--
 .../lovelace/components/hui-generic-entity-row.ts   |  2 +-
 .../lovelace/entity-rows/hui-datetime-entity-row.ts |  2 +-
 .../entity-rows/hui-input-select-entity-row.ts      |  2 +-
 .../entity-rows/hui-input-text-entity-row.ts        |  2 +-
 .../lovelace/entity-rows/hui-select-entity-row.ts   |  2 +-
 .../lovelace/entity-rows/hui-text-entity-row.ts     |  2 +-
 src/panels/map/ha-panel-map.ts                      |  4 ++--
 src/panels/profile/ha-pick-language-row.ts          |  2 +-
 src/panels/todo/dialog-todo-item-editor.ts          |  2 +-
 src/state-summary/state-card-content.ts             |  2 +-
 61 files changed, 99 insertions(+), 88 deletions(-)

diff --git a/gallery/src/components/demo-more-info.ts b/gallery/src/components/demo-more-info.ts
index fb0ab5ff5e63..5e39ab9eac6f 100644
--- a/gallery/src/components/demo-more-info.ts
+++ b/gallery/src/components/demo-more-info.ts
@@ -23,7 +23,7 @@ class DemoMoreInfo extends LitElement {
             <state-card-content
               .stateObj=${state}
               .hass=${this.hass}
-              inDialog
+              in-dialog
             ></state-card-content>
 
             <more-info-content
diff --git a/gallery/src/pages/automation/trace.ts b/gallery/src/pages/automation/trace.ts
index 86fac502a903..2b6549c07fc3 100644
--- a/gallery/src/pages/automation/trace.ts
+++ b/gallery/src/pages/automation/trace.ts
@@ -35,7 +35,7 @@ export class DemoAutomationTrace extends LitElement {
                 .sampleIdx=${idx}
               ></hat-script-graph>
               <hat-trace-timeline
-                allowPick
+                allow-pick
                 .hass=${this.hass}
                 .trace=${trace.trace}
                 .logbookEntries=${trace.logbookEntries}
diff --git a/hassio/src/backups/hassio-backups.ts b/hassio/src/backups/hassio-backups.ts
index ca0321ecffcf..1250e62f886f 100644
--- a/hassio/src/backups/hassio-backups.ts
+++ b/hassio/src/backups/hassio-backups.ts
@@ -198,7 +198,7 @@ export class HassioBackups extends LitElement {
         @selection-changed=${this._handleSelectionChanged}
         clickable
         selectable
-        hasFab
+        has-fab
         .mainPage=${!atLeastVersion(this.hass.config.version, 2021, 12)}
         back-path=${atLeastVersion(this.hass.config.version, 2022, 5)
           ? "/config/system"
diff --git a/hassio/src/dashboard/hassio-dashboard.ts b/hassio/src/dashboard/hassio-dashboard.ts
index 9eaa76a9a4e6..531f17154114 100644
--- a/hassio/src/dashboard/hassio-dashboard.ts
+++ b/hassio/src/dashboard/hassio-dashboard.ts
@@ -76,7 +76,7 @@ class HassioDashboard extends LitElement {
         .mainPage=${!atLeastVersion(this.hass.config.version, 2021, 12)}
         back-path="/config"
         supervisor
-        hasFab
+        has-fab
       >
         <span slot="header">
           ${this.supervisor.localize(
diff --git a/landing-page/src/ha-landing-page.ts b/landing-page/src/ha-landing-page.ts
index 7c5f058b1599..338fdbeafb27 100644
--- a/landing-page/src/ha-landing-page.ts
+++ b/landing-page/src/ha-landing-page.ts
@@ -64,9 +64,9 @@ class HaLandingPage extends LandingPageBaseElement {
         <ha-language-picker
           .value=${this.language}
           .label=${""}
-          nativeName
+          native-name
           @value-changed=${this._languageChanged}
-          inlineArrow
+          inline-arrow
         ></ha-language-picker>
         <a
           href="https://www.home-assistant.io/getting-started/onboarding/"
diff --git a/src/auth/ha-authorize.ts b/src/auth/ha-authorize.ts
index 7208a25109f2..6cfb67b696f4 100644
--- a/src/auth/ha-authorize.ts
+++ b/src/auth/ha-authorize.ts
@@ -202,9 +202,9 @@ export class HaAuthorize extends litLocalizeLiteMixin(LitElement) {
         <ha-language-picker
           .value=${this.language}
           .label=${""}
-          nativeName
+          native-name
           @value-changed=${this._languageChanged}
-          inlineArrow
+          inline-arrow
         ></ha-language-picker>
         <a
           href="https://www.home-assistant.io/docs/authentication/"
diff --git a/src/components/chart/statistics-chart.ts b/src/components/chart/statistics-chart.ts
index 9153cf99dd91..d1e2ac5e7610 100644
--- a/src/components/chart/statistics-chart.ts
+++ b/src/components/chart/statistics-chart.ts
@@ -74,7 +74,8 @@ export class StatisticsChart extends LitElement {
 
   @property({ attribute: false, type: Boolean }) public fitYData = false;
 
-  @property({ attribute: false, type: Boolean }) public hideLegend = false;
+  @property({ attribute: "hide-legend", type: Boolean }) public hideLegend =
+    false;
 
   @property({ attribute: false, type: Boolean }) public logarithmicScale =
     false;
diff --git a/src/components/ha-code-editor.ts b/src/components/ha-code-editor.ts
index dcd774a54d48..c43fc4ff9a37 100644
--- a/src/components/ha-code-editor.ts
+++ b/src/components/ha-code-editor.ts
@@ -47,7 +47,7 @@ export class HaCodeEditor extends ReactiveElement {
   // eslint-disable-next-line lit/no-native-attributes
   @property({ type: Boolean }) public autofocus = false;
 
-  @property({ attribute: false, type: Boolean }) public readOnly = false;
+  @property({ attribute: "read-only", type: Boolean }) public readOnly = false;
 
   @property({ type: Boolean }) public linewrap = false;
 
diff --git a/src/components/ha-date-input.ts b/src/components/ha-date-input.ts
index 7d3524851e28..80b86b7559c9 100644
--- a/src/components/ha-date-input.ts
+++ b/src/components/ha-date-input.ts
@@ -51,7 +51,7 @@ export class HaDateInput extends LitElement {
 
   @property() public helper?: string;
 
-  @property({ attribute: false, type: Boolean }) public canClear = false;
+  @property({ attribute: "can-clear", type: Boolean }) public canClear = false;
 
   render() {
     return html`<ha-textfield
diff --git a/src/components/ha-icon-button.ts b/src/components/ha-icon-button.ts
index 5f067a2835b7..50490440fdd7 100644
--- a/src/components/ha-icon-button.ts
+++ b/src/components/ha-icon-button.ts
@@ -21,7 +21,7 @@ export class HaIconButton extends LitElement {
   @property({ type: String, attribute: "aria-haspopup" })
   override ariaHasPopup!: IconButton["ariaHasPopup"];
 
-  @property({ attribute: false, type: Boolean }) hideTitle = false;
+  @property({ attribute: "hide-title", type: Boolean }) hideTitle = false;
 
   @query("mwc-icon-button", true) private _button?: IconButton;
 
diff --git a/src/components/ha-language-picker.ts b/src/components/ha-language-picker.ts
index 650f5223158e..f25f7d481491 100644
--- a/src/components/ha-language-picker.ts
+++ b/src/components/ha-language-picker.ts
@@ -27,11 +27,13 @@ export class HaLanguagePicker extends LitElement {
 
   @property({ type: Boolean }) public required = false;
 
-  @property({ attribute: false, type: Boolean }) public nativeName = false;
+  @property({ attribute: "native-name", type: Boolean })
+  public nativeName = false;
 
-  @property({ attribute: false, type: Boolean }) public noSort = false;
+  @property({ attribute: "no-sort", type: Boolean }) public noSort = false;
 
-  @property({ attribute: false, type: Boolean }) public inlineArrow = false;
+  @property({ attribute: "inline-arrow", type: Boolean })
+  public inlineArrow = false;
 
   @state() _defaultLanguages: string[] = [];
 
diff --git a/src/components/ha-select.ts b/src/components/ha-select.ts
index 7fce69b9ccc7..f856f0edd1d7 100644
--- a/src/components/ha-select.ts
+++ b/src/components/ha-select.ts
@@ -14,7 +14,8 @@ export class HaSelect extends SelectBase {
 
   @property({ type: Boolean, reflect: true }) public clearable = false;
 
-  @property({ attribute: false, type: Boolean }) public inlineArrow = false;
+  @property({ attribute: "inline-arrow", type: Boolean })
+  public inlineArrow = false;
 
   protected override render() {
     return html`
diff --git a/src/components/ha-service-control.ts b/src/components/ha-service-control.ts
index 3bba2598351a..dfc26ed559c1 100644
--- a/src/components/ha-service-control.ts
+++ b/src/components/ha-service-control.ts
@@ -86,7 +86,8 @@ export class HaServiceControl extends LitElement {
 
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: "show-advanced", type: Boolean }) public showAdvanced =
+    false;
 
   @property({ attribute: false, type: Boolean, reflect: true })
   public hidePicker = false;
diff --git a/src/components/ha-target-picker.ts b/src/components/ha-target-picker.ts
index 67cbc98957be..f93148c0c31d 100644
--- a/src/components/ha-target-picker.ts
+++ b/src/components/ha-target-picker.ts
@@ -345,7 +345,7 @@ export class HaTargetPicker extends SubscribeMixin(LitElement) {
                   "ui.components.target-picker.expand"
                 )}
                 .path=${mdiUnfoldMoreVertical}
-                hideTitle
+                hide-title
                 .id=${id}
                 .type=${type}
                 @click=${this._handleExpand}
@@ -361,7 +361,7 @@ export class HaTargetPicker extends SubscribeMixin(LitElement) {
             class="mdc-chip__icon mdc-chip__icon--trailing"
             .label=${this.hass.localize("ui.components.target-picker.remove")}
             .path=${mdiClose}
-            hideTitle
+            hide-title
             .id=${id}
             .type=${type}
             @click=${this._handleRemove}
diff --git a/src/components/ha-textfield.ts b/src/components/ha-textfield.ts
index df03a5d55068..57304e171c6c 100644
--- a/src/components/ha-textfield.ts
+++ b/src/components/ha-textfield.ts
@@ -15,7 +15,8 @@ export class HaTextField extends TextFieldBase {
   @property({ type: Boolean }) public icon = false;
 
   // @ts-ignore
-  @property({ attribute: false, type: Boolean }) public iconTrailing = false;
+  // eslint-disable-next-line lit/attribute-names
+  @property({ type: Boolean }) public iconTrailing = false;
 
   @property() public autocomplete?: string;
 
diff --git a/src/components/ha-yaml-editor.ts b/src/components/ha-yaml-editor.ts
index 7e74759d7608..561feb0f3f80 100644
--- a/src/components/ha-yaml-editor.ts
+++ b/src/components/ha-yaml-editor.ts
@@ -34,19 +34,22 @@ export class HaYamlEditor extends LitElement {
 
   @property({ attribute: false }) public defaultValue?: any;
 
-  @property({ attribute: false, type: Boolean }) public isValid = true;
+  @property({ attribute: "is-valid", type: Boolean }) public isValid = true;
 
   @property() public label?: string;
 
-  @property({ attribute: false, type: Boolean }) public autoUpdate = false;
+  @property({ attribute: "auto-update", type: Boolean }) public autoUpdate =
+    false;
 
-  @property({ attribute: false, type: Boolean }) public readOnly = false;
+  @property({ attribute: "read-only", type: Boolean }) public readOnly = false;
 
   @property({ type: Boolean }) public required = false;
 
-  @property({ attribute: false, type: Boolean }) public copyClipboard = false;
+  @property({ attribute: "copy-clipboard", type: Boolean })
+  public copyClipboard = false;
 
-  @property({ attribute: false, type: Boolean }) public hasExtraActions = false;
+  @property({ attribute: "has-extra-actions", type: Boolean })
+  public hasExtraActions = false;
 
   @state() private _yaml = "";
 
diff --git a/src/components/map/ha-map.ts b/src/components/map/ha-map.ts
index e4a72802e717..1b984590a77d 100644
--- a/src/components/map/ha-map.ts
+++ b/src/components/map/ha-map.ts
@@ -69,12 +69,13 @@ export class HaMap extends ReactiveElement {
 
   @property({ type: Boolean }) public clickable = false;
 
-  @property({ attribute: false, type: Boolean }) public autoFit = false;
+  @property({ attribute: "auto-fit", type: Boolean }) public autoFit = false;
 
-  @property({ attribute: false, type: Boolean }) public renderPassive = false;
+  @property({ attribute: "render-passive", type: Boolean })
+  public renderPassive = false;
 
-  @property({ attribute: false, type: Boolean }) public interactiveZones =
-    false;
+  @property({ attribute: "interactive-zones", type: Boolean })
+  public interactiveZones = false;
 
   @property({ attribute: false, type: Boolean }) public fitZones = false;
 
diff --git a/src/components/trace/ha-trace-blueprint-config.ts b/src/components/trace/ha-trace-blueprint-config.ts
index 5d449504cb4a..f9818e1c741a 100644
--- a/src/components/trace/ha-trace-blueprint-config.ts
+++ b/src/components/trace/ha-trace-blueprint-config.ts
@@ -17,7 +17,7 @@ export class HaTraceBlueprintConfig extends LitElement {
     return html`
       <ha-code-editor
         .value=${dump(this.trace.blueprint_inputs || "").trimRight()}
-        readOnly
+        read-only
         dir="ltr"
       ></ha-code-editor>
     `;
diff --git a/src/components/trace/ha-trace-config.ts b/src/components/trace/ha-trace-config.ts
index e29aca47c676..efc7e0f0c93d 100644
--- a/src/components/trace/ha-trace-config.ts
+++ b/src/components/trace/ha-trace-config.ts
@@ -17,7 +17,7 @@ export class HaTraceConfig extends LitElement {
     return html`
       <ha-code-editor
         .value=${dump(this.trace.config).trimRight()}
-        readOnly
+        read-only
         dir="ltr"
       ></ha-code-editor>
     `;
diff --git a/src/components/trace/ha-trace-path-details.ts b/src/components/trace/ha-trace-path-details.ts
index 75b4946f71ee..19c8590af454 100644
--- a/src/components/trace/ha-trace-path-details.ts
+++ b/src/components/trace/ha-trace-path-details.ts
@@ -223,7 +223,7 @@ export class HaTracePathDetails extends LitElement {
     return config
       ? html`<ha-code-editor
           .value=${dump(config).trimEnd()}
-          readOnly
+          read-only
           dir="ltr"
         ></ha-code-editor>`
       : this.hass!.localize(
diff --git a/src/components/trace/ha-trace-timeline.ts b/src/components/trace/ha-trace-timeline.ts
index 07e7fc360026..024e257f68a1 100644
--- a/src/components/trace/ha-trace-timeline.ts
+++ b/src/components/trace/ha-trace-timeline.ts
@@ -25,7 +25,7 @@ export class HaTraceTimeline extends LitElement {
         .trace=${this.trace}
         .logbookEntries=${this.logbookEntries}
         .selectedPath=${this.selected.path}
-        allowPick
+        allow-pick
       >
       </hat-trace-timeline>
       <hat-logbook-note
diff --git a/src/components/trace/hat-trace-timeline.ts b/src/components/trace/hat-trace-timeline.ts
index 0dbdd4abb5c9..6a12ceb1c80c 100644
--- a/src/components/trace/hat-trace-timeline.ts
+++ b/src/components/trace/hat-trace-timeline.ts
@@ -676,7 +676,8 @@ export class HaAutomationTracer extends LitElement {
 
   @property({ attribute: false }) public selectedPath?: string;
 
-  @property({ attribute: false, type: Boolean }) public allowPick = false;
+  @property({ attribute: "allow-pick", type: Boolean }) public allowPick =
+    false;
 
   @state()
   @consume({ context: fullEntitiesContext, subscribe: true })
diff --git a/src/dialogs/more-info/controls/more-info-person.ts b/src/dialogs/more-info/controls/more-info-person.ts
index 76aa1b7e3bf3..d70101ad468a 100644
--- a/src/dialogs/more-info/controls/more-info-person.ts
+++ b/src/dialogs/more-info/controls/more-info-person.ts
@@ -29,7 +29,7 @@ class MoreInfoPerson extends LitElement {
             <ha-map
               .hass=${this.hass}
               .entities=${this._entityArray(this.stateObj.entity_id)}
-              autoFit
+              auto-fit
             ></ha-map>
           `
         : ""}
diff --git a/src/dialogs/more-info/ha-more-info-history.ts b/src/dialogs/more-info/ha-more-info-history.ts
index 33d3cbd8cc8a..6f7792f86620 100644
--- a/src/dialogs/more-info/ha-more-info-history.ts
+++ b/src/dialogs/more-info/ha-more-info-history.ts
@@ -93,8 +93,7 @@ export class MoreInfoHistory extends LitElement {
                   .metadata=${this._metadata}
                   .statTypes=${statTypes}
                   .names=${this._statNames}
-                  hideLegend
-                  .showNames=${false}
+                  hide-legend
                   .clickForMoreInfo=${false}
                 ></statistics-chart>`
               : html`<state-history-charts
diff --git a/src/dialogs/more-info/ha-more-info-info.ts b/src/dialogs/more-info/ha-more-info-info.ts
index c4f220f2ff01..efee44afbdc8 100644
--- a/src/dialogs/more-info/ha-more-info-info.ts
+++ b/src/dialogs/more-info/ha-more-info-info.ts
@@ -72,7 +72,7 @@ export class MoreInfoInfo extends LitElement {
             ? ""
             : html`
                 <state-card-content
-                  inDialog
+                  in-dialog
                   .stateObj=${stateObj}
                   .hass=${this.hass}
                 ></state-card-content>
diff --git a/src/layouts/hass-tabs-subpage-data-table.ts b/src/layouts/hass-tabs-subpage-data-table.ts
index 2be1b35d0fa6..af90aff98264 100644
--- a/src/layouts/hass-tabs-subpage-data-table.ts
+++ b/src/layouts/hass-tabs-subpage-data-table.ts
@@ -84,7 +84,7 @@ export class HaTabsSubpageDataTable extends LitElement {
    * Do we need to add padding for a fab.
    * @type {Boolean}
    */
-  @property({ attribute: false, type: Boolean }) public hasFab = false;
+  @property({ attribute: "has-fab", type: Boolean }) public hasFab = false;
 
   /**
    * Add an extra row at the bottom of the data table
@@ -156,7 +156,8 @@ export class HaTabsSubpageDataTable extends LitElement {
    * Show the filter menu.
    * @type {Boolean}
    */
-  @property({ attribute: false, type: Boolean }) public hasFilters = false;
+  @property({ attribute: "has-filters", type: Boolean }) public hasFilters =
+    false;
 
   @property({ attribute: false, type: Boolean }) public showFilters = false;
 
diff --git a/src/onboarding/ha-onboarding.ts b/src/onboarding/ha-onboarding.ts
index 466f6f070e84..4716165ebefc 100644
--- a/src/onboarding/ha-onboarding.ts
+++ b/src/onboarding/ha-onboarding.ts
@@ -141,9 +141,9 @@ class HaOnboarding extends litLocalizeLiteMixin(HassElement) {
         <ha-language-picker
           .value=${this.language}
           .label=${""}
-          nativeName
+          native-name
           @value-changed=${this._languageChanged}
-          inlineArrow
+          inline-arrow
         ></ha-language-picker>
         <a
           href="https://www.home-assistant.io/getting-started/onboarding/"
diff --git a/src/panels/calendar/dialog-calendar-event-detail.ts b/src/panels/calendar/dialog-calendar-event-detail.ts
index b3031df02cde..45863e5e443c 100644
--- a/src/panels/calendar/dialog-calendar-event-detail.ts
+++ b/src/panels/calendar/dialog-calendar-event-detail.ts
@@ -93,7 +93,7 @@ class DialogCalendarEventDetail extends LitElement {
               .hass=${this.hass}
               .stateObj=${stateObj}
               .color=${this._params.color}
-              inDialog
+              in-dialog
             ></state-info>
           </div>
         </div>
diff --git a/src/panels/config/application_credentials/ha-config-application-credentials.ts b/src/panels/config/application_credentials/ha-config-application-credentials.ts
index 08968bbeced1..5d188627404e 100644
--- a/src/panels/config/application_credentials/ha-config-application-credentials.ts
+++ b/src/panels/config/application_credentials/ha-config-application-credentials.ts
@@ -159,7 +159,7 @@ export class HaConfigApplicationCredentials extends LitElement {
           this._applicationCredentials,
           this.hass.localize
         )}
-        hasFab
+        has-fab
         selectable
         .selected=${this._selected.length}
         @selection-changed=${this._handleSelectionChanged}
diff --git a/src/panels/config/automation/ha-automation-editor.ts b/src/panels/config/automation/ha-automation-editor.ts
index 9e81a67e0dec..6f1b4c662ef6 100644
--- a/src/panels/config/automation/ha-automation-editor.ts
+++ b/src/panels/config/automation/ha-automation-editor.ts
@@ -413,7 +413,7 @@ export class HaAutomationEditor extends KeyboardShortcutMixin(LitElement) {
                       `
                     : ""}
                   <ha-yaml-editor
-                    copyClipboard
+                    copy-clipboard
                     .hass=${this.hass}
                     .defaultValue=${this._preprocessYaml()}
                     .readOnly=${this._readOnly}
diff --git a/src/panels/config/automation/ha-automation-picker.ts b/src/panels/config/automation/ha-automation-picker.ts
index 45c8b630a705..cbcc207630e0 100644
--- a/src/panels/config/automation/ha-automation-picker.ts
+++ b/src/panels/config/automation/ha-automation-picker.ts
@@ -522,7 +522,7 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) {
         selectable
         .selected=${this._selected.length}
         @selection-changed=${this._handleSelectionChanged}
-        hasFilters
+        has-filters
         .filters=${
           Object.values(this._filters).filter((filter) =>
             Array.isArray(filter.value)
@@ -556,7 +556,7 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) {
         @clear-filter=${this._clearFilter}
         .filter=${this._filter}
         @search-changed=${this._handleSearchChange}
-        hasFab
+        has-fab
         clickable
         class=${this.narrow ? "narrow" : ""}
       >
diff --git a/src/panels/config/automation/trigger/ha-automation-trigger-row.ts b/src/panels/config/automation/trigger/ha-automation-trigger-row.ts
index fb7a6301917b..532e6c91999e 100644
--- a/src/panels/config/automation/trigger/ha-automation-trigger-row.ts
+++ b/src/panels/config/automation/trigger/ha-automation-trigger-row.ts
@@ -613,7 +613,7 @@ export default class HaAutomationTriggerRow extends LitElement {
       ),
       text: html`
         <ha-yaml-editor
-          readOnly
+          read-only
           .hass=${this.hass}
           .defaultValue=${this._triggered}
         ></ha-yaml-editor>
diff --git a/src/panels/config/backup/ha-config-backup.ts b/src/panels/config/backup/ha-config-backup.ts
index cb0c164afd2c..eb9a81322a27 100644
--- a/src/panels/config/backup/ha-config-backup.ts
+++ b/src/panels/config/backup/ha-config-backup.ts
@@ -130,7 +130,7 @@ class HaConfigBackup extends LitElement {
 
     return html`
       <hass-tabs-subpage-data-table
-        hasFab
+        has-fab
         .tabs=${[
           {
             translationKey: "ui.panel.config.backup.caption",
diff --git a/src/panels/config/blueprint/ha-blueprint-overview.ts b/src/panels/config/blueprint/ha-blueprint-overview.ts
index 78454bbfec2c..294edb981401 100644
--- a/src/panels/config/blueprint/ha-blueprint-overview.ts
+++ b/src/panels/config/blueprint/ha-blueprint-overview.ts
@@ -290,7 +290,7 @@ class HaBlueprintOverview extends LitElement {
         .noDataText=${this.hass.localize(
           "ui.panel.config.blueprint.overview.no_blueprints"
         )}
-        hasFab
+        has-fab
         clickable
         @row-click=${this._handleRowClicked}
         .appendRow=${html`<div
diff --git a/src/panels/config/core/ha-config-section-general.ts b/src/panels/config/core/ha-config-section-general.ts
index 22eb751cea28..693937b1d067 100644
--- a/src/panels/config/core/ha-config-section-general.ts
+++ b/src/panels/config/core/ha-config-section-general.ts
@@ -229,7 +229,7 @@ class HaConfigSectionGeneral extends LitElement {
               ></ha-country-picker>
               <ha-language-picker
                 .hass=${this.hass}
-                nativeName
+                native-name
                 .label=${this.hass.localize(
                   "ui.panel.config.core.section.core.core_config.language"
                 )}
diff --git a/src/panels/config/devices/ha-config-devices-dashboard.ts b/src/panels/config/devices/ha-config-devices-dashboard.ts
index 8e794f07f696..f775364070d9 100644
--- a/src/panels/config/devices/ha-config-devices-dashboard.ts
+++ b/src/panels/config/devices/ha-config-devices-dashboard.ts
@@ -709,7 +709,7 @@ export class HaConfigDeviceDashboard extends SubscribeMixin(LitElement) {
         .selected=${this._selected.length}
         @selection-changed=${this._handleSelectionChanged}
         .filter=${this._filter}
-        hasFilters
+        has-filters
         .filters=${Object.values(this._filters).filter((filter) =>
           Array.isArray(filter.value)
             ? filter.value.length
@@ -731,7 +731,7 @@ export class HaConfigDeviceDashboard extends SubscribeMixin(LitElement) {
         @collapsed-changed=${this._handleCollapseChanged}
         @row-click=${this._handleRowClicked}
         clickable
-        hasFab
+        has-fab
         class=${this.narrow ? "narrow" : ""}
       >
         <ha-integration-overflow-menu
diff --git a/src/panels/config/entities/ha-config-entities.ts b/src/panels/config/entities/ha-config-entities.ts
index ab11698976f3..b6cab5ce8689 100644
--- a/src/panels/config/entities/ha-config-entities.ts
+++ b/src/panels/config/entities/ha-config-entities.ts
@@ -750,7 +750,7 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) {
           "ui.panel.config.entities.picker.search",
           { number: filteredEntities.length }
         )}
-        hasFilters
+        has-filters
         .filters=${
           Object.values(this._filters).filter((filter) =>
             Array.isArray(filter)
diff --git a/src/panels/config/helpers/ha-config-helpers.ts b/src/panels/config/helpers/ha-config-helpers.ts
index 3d27a66775b7..f8328902761c 100644
--- a/src/panels/config/helpers/ha-config-helpers.ts
+++ b/src/panels/config/helpers/ha-config-helpers.ts
@@ -616,7 +616,7 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
         selectable
         .selected=${this._selected.length}
         @selection-changed=${this._handleSelectionChanged}
-        hasFilters
+        has-filters
         .filters=${Object.values(this._filters).filter((filter) =>
           Array.isArray(filter)
             ? filter.length
@@ -641,7 +641,7 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
         @row-click=${this._openEditDialog}
         .filter=${this._filter}
         @search-changed=${this._handleSearchChange}
-        hasFab
+        has-fab
         clickable
         .noDataText=${this.hass.localize(
           "ui.panel.config.helpers.picker.no_helpers"
diff --git a/src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts b/src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts
index 034b530c0fc8..5f6352d932f5 100644
--- a/src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts
+++ b/src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts
@@ -109,7 +109,7 @@ export class ZHAGroupsDashboard extends LitElement {
         .data=${this._formattedGroups(this._groups)}
         @row-click=${this._handleRowClicked}
         clickable
-        hasFab
+        has-fab
       >
         <a href="/config/zha/group-add" slot="fab">
           <ha-fab
diff --git a/src/panels/config/labels/ha-config-labels.ts b/src/panels/config/labels/ha-config-labels.ts
index 0ee2e373ec5c..48cb1307563a 100644
--- a/src/panels/config/labels/ha-config-labels.ts
+++ b/src/panels/config/labels/ha-config-labels.ts
@@ -229,7 +229,7 @@ export class HaConfigLabels extends LitElement {
         .columns=${this._columns(this.hass.localize, this.narrow)}
         .data=${this._data(this._labels)}
         .noDataText=${this.hass.localize("ui.panel.config.labels.no_labels")}
-        hasFab
+        has-fab
         .initialSorting=${this._activeSorting}
         .columnOrder=${this._activeColumnOrder}
         .hiddenColumns=${this._activeHiddenColumns}
diff --git a/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts b/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts
index 0d28fb3e340c..5023dd41e8ff 100644
--- a/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts
+++ b/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts
@@ -322,7 +322,7 @@ export class HaConfigLovelaceDashboards extends LitElement {
         @search-changed=${this._handleSearchChange}
         @row-click=${this._editDashboard}
         id="url_path"
-        hasFab
+        has-fab
         clickable
       >
         <ha-button-menu slot="toolbar-icon" activatable>
diff --git a/src/panels/config/scene/ha-scene-dashboard.ts b/src/panels/config/scene/ha-scene-dashboard.ts
index 484838305853..473a1d9dd64d 100644
--- a/src/panels/config/scene/ha-scene-dashboard.ts
+++ b/src/panels/config/scene/ha-scene-dashboard.ts
@@ -541,7 +541,7 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {
         selectable
         .selected=${this._selected.length}
         @selection-changed=${this._handleSelectionChanged}
-        hasFilters
+        has-filters
         .filters=${Object.values(this._filters).filter((filter) =>
           Array.isArray(filter.value)
             ? filter.value.length
@@ -570,7 +570,7 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {
         @clear-filter=${this._clearFilter}
         .filter=${this._filter}
         @search-changed=${this._handleSearchChange}
-        hasFab
+        has-fab
         clickable
         @row-click=${this._handleRowClicked}
       >
diff --git a/src/panels/config/script/ha-script-editor.ts b/src/panels/config/script/ha-script-editor.ts
index 8a03fa13d3f0..418607183518 100644
--- a/src/panels/config/script/ha-script-editor.ts
+++ b/src/panels/config/script/ha-script-editor.ts
@@ -366,7 +366,7 @@ export class HaScriptEditor extends KeyboardShortcutMixin(LitElement) {
               `
             : this._mode === "yaml"
               ? html`<ha-yaml-editor
-                  copyClipboard
+                  copy-clipboard
                   .hass=${this.hass}
                   .defaultValue=${this._preprocessYaml()}
                   .readOnly=${this._readOnly}
diff --git a/src/panels/config/script/ha-script-picker.ts b/src/panels/config/script/ha-script-picker.ts
index 1dd1cdc9720d..342b3fa88b89 100644
--- a/src/panels/config/script/ha-script-picker.ts
+++ b/src/panels/config/script/ha-script-picker.ts
@@ -526,7 +526,7 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
           "ui.panel.config.script.picker.search",
           { number: scripts.length }
         )}
-        hasFilters
+        has-filters
         .initialGroupColumn=${this._activeGrouping || "category"}
         .initialCollapsedGroups=${this._activeCollapsed}
         .initialSorting=${this._activeSorting}
@@ -558,7 +558,7 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
         @clear-filter=${this._clearFilter}
         .filter=${this._filter}
         @search-changed=${this._handleSearchChange}
-        hasFab
+        has-fab
         clickable
         class=${this.narrow ? "narrow" : ""}
         @row-click=${this._handleRowClicked}
diff --git a/src/panels/config/tags/ha-config-tags.ts b/src/panels/config/tags/ha-config-tags.ts
index a81dfd41cad1..cdd8188acc5d 100644
--- a/src/panels/config/tags/ha-config-tags.ts
+++ b/src/panels/config/tags/ha-config-tags.ts
@@ -192,7 +192,7 @@ export class HaConfigTags extends SubscribeMixin(LitElement) {
         .noDataText=${this.hass.localize("ui.panel.config.tag.no_tags")}
         .filter=${this._filter}
         @search-changed=${this._handleSearchChange}
-        hasFab
+        has-fab
         clickable
         @row-click=${this._editTag}
         id="id"
diff --git a/src/panels/config/users/ha-config-users.ts b/src/panels/config/users/ha-config-users.ts
index 07c1342f1d53..ea5ae6e3ca17 100644
--- a/src/panels/config/users/ha-config-users.ts
+++ b/src/panels/config/users/ha-config-users.ts
@@ -195,7 +195,7 @@ export class HaConfigUsers extends LitElement {
         .filter=${this._filter}
         @search-changed=${this._handleSearchChange}
         @row-click=${this._editUser}
-        hasFab
+        has-fab
         clickable
       >
         <ha-fab
diff --git a/src/panels/config/voice-assistants/debug/assist-render-pipeline-run.ts b/src/panels/config/voice-assistants/debug/assist-render-pipeline-run.ts
index 9d3bbf81eac5..26c4a88ac474 100644
--- a/src/panels/config/voice-assistants/debug/assist-render-pipeline-run.ts
+++ b/src/panels/config/voice-assistants/debug/assist-render-pipeline-run.ts
@@ -365,8 +365,8 @@ export class AssistPipelineDebug extends LitElement {
         <ha-expansion-panel>
           <span slot="header">Raw</span>
           <ha-yaml-editor
-            readOnly
-            autoUpdate
+            read-only
+            auto-update
             .value=${this.pipelineRun}
           ></ha-yaml-editor>
         </ha-expansion-panel>
diff --git a/src/panels/config/voice-assistants/ha-config-voice-assistants-expose.ts b/src/panels/config/voice-assistants/ha-config-voice-assistants-expose.ts
index 4abfb5933dc9..d9fe8ca7758e 100644
--- a/src/panels/config/voice-assistants/ha-config-voice-assistants-expose.ts
+++ b/src/panels/config/voice-assistants/ha-config-voice-assistants-expose.ts
@@ -576,7 +576,7 @@ export class VoiceAssistantsExpose extends LitElement {
         @search-changed=${this._handleSearchChange}
         @row-click=${this._openEditEntry}
         id="entity_id"
-        hasFab
+        has-fab
       >
         ${this._selectedEntities.length
           ? html`
diff --git a/src/panels/developer-tools/action/developer-tools-action.ts b/src/panels/developer-tools/action/developer-tools-action.ts
index cfeedd267b7d..5098dfc716cc 100644
--- a/src/panels/developer-tools/action/developer-tools-action.ts
+++ b/src/panels/developer-tools/action/developer-tools-action.ts
@@ -153,7 +153,7 @@ class HaPanelDevAction extends LitElement {
                   .hass=${this.hass}
                   .value=${this._serviceData}
                   .narrow=${this.narrow}
-                  showAdvanced
+                  show-advanced
                   @value-changed=${this._serviceDataChanged}
                   class="card-content"
                 ></ha-service-control>
@@ -203,10 +203,10 @@ class HaPanelDevAction extends LitElement {
               <div class="card-content">
                 <ha-yaml-editor
                   .hass=${this.hass}
-                  copyClipboard
-                  readOnly
-                  autoUpdate
-                  hasExtraActions
+                  copy-clipboard
+                  read-only
+                  auto-update
+                  has-extra-actions
                   .value=${this._response}
                 >
                   <ha-button slot="extra-actions" @click=${this._copyTemplate}
diff --git a/src/panels/developer-tools/event/event-subscribe-card.ts b/src/panels/developer-tools/event/event-subscribe-card.ts
index 13b0b931414f..bc6a19a12d4a 100644
--- a/src/panels/developer-tools/event/event-subscribe-card.ts
+++ b/src/panels/developer-tools/event/event-subscribe-card.ts
@@ -104,7 +104,7 @@ class EventSubscribeCard extends LitElement {
                   )}:
                   <ha-yaml-editor
                     .defaultValue=${event.event}
-                    readOnly
+                    read-only
                   ></ha-yaml-editor>
                 </div>
               `
diff --git a/src/panels/lovelace/cards/hui-map-card.ts b/src/panels/lovelace/cards/hui-map-card.ts
index f1234225722c..970c1af462c5 100644
--- a/src/panels/lovelace/cards/hui-map-card.ts
+++ b/src/panels/lovelace/cards/hui-map-card.ts
@@ -169,8 +169,8 @@ class HuiMapCard extends LitElement implements LovelaceCard {
             .autoFit=${this._config.auto_fit || false}
             .fitZones=${this._config.fit_zones}
             .themeMode=${themeMode}
-            interactiveZones
-            renderPassive
+            interactive-zones
+            render-passive
           ></ha-map>
           <ha-icon-button
             .label=${this.hass!.localize(
diff --git a/src/panels/lovelace/components/hui-generic-entity-row.ts b/src/panels/lovelace/components/hui-generic-entity-row.ts
index 71d8acebaf16..449c3bd6e602 100644
--- a/src/panels/lovelace/components/hui-generic-entity-row.ts
+++ b/src/panels/lovelace/components/hui-generic-entity-row.ts
@@ -25,7 +25,7 @@ export class HuiGenericEntityRow extends LitElement {
 
   @property({ attribute: false }) public secondaryText?: string;
 
-  @property({ attribute: false, type: Boolean }) public hideName = false;
+  @property({ attribute: "hide-name", type: Boolean }) public hideName = false;
 
   // Allows to control if this row should capture the user interaction, e.g. with its
   // toggle switch, button or input field. Some domains dynamically decide what to show
diff --git a/src/panels/lovelace/entity-rows/hui-datetime-entity-row.ts b/src/panels/lovelace/entity-rows/hui-datetime-entity-row.ts
index 583f49d4f47c..8c63d4cfa257 100644
--- a/src/panels/lovelace/entity-rows/hui-datetime-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-datetime-entity-row.ts
@@ -57,7 +57,7 @@ class HuiInputDatetimeEntityRow extends LitElement implements LovelaceRow {
       <hui-generic-entity-row
         .hass=${this.hass}
         .config=${this._config}
-        hideName
+        hide-name
       >
         <div>
           <ha-date-input
diff --git a/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts b/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts
index 8b5c903de9ac..9a256e6e48cb 100644
--- a/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts
@@ -80,7 +80,7 @@ class HuiInputSelectEntityRow extends LitElement implements LovelaceRow {
       <hui-generic-entity-row
         .hass=${this.hass}
         .config=${this._config}
-        hideName
+        hide-name
       >
         <ha-select
           .label=${this._config.name || computeStateName(stateObj)}
diff --git a/src/panels/lovelace/entity-rows/hui-input-text-entity-row.ts b/src/panels/lovelace/entity-rows/hui-input-text-entity-row.ts
index 3b17cb0cd777..73f00a7a115c 100644
--- a/src/panels/lovelace/entity-rows/hui-input-text-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-input-text-entity-row.ts
@@ -47,7 +47,7 @@ class HuiInputTextEntityRow extends LitElement implements LovelaceRow {
       <hui-generic-entity-row
         .hass=${this.hass}
         .config=${this._config}
-        hideName
+        hide-name
       >
         <ha-textfield
           .label=${this._config.name || computeStateName(stateObj)}
diff --git a/src/panels/lovelace/entity-rows/hui-select-entity-row.ts b/src/panels/lovelace/entity-rows/hui-select-entity-row.ts
index cf6cfb73e8ed..05fad8e7ebec 100644
--- a/src/panels/lovelace/entity-rows/hui-select-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-select-entity-row.ts
@@ -56,7 +56,7 @@ class HuiSelectEntityRow extends LitElement implements LovelaceRow {
       <hui-generic-entity-row
         .hass=${this.hass}
         .config=${this._config}
-        hideName
+        hide-name
       >
         <ha-select
           .label=${this._config.name || computeStateName(stateObj)}
diff --git a/src/panels/lovelace/entity-rows/hui-text-entity-row.ts b/src/panels/lovelace/entity-rows/hui-text-entity-row.ts
index 0424895769d6..d593225ad3f1 100644
--- a/src/panels/lovelace/entity-rows/hui-text-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-text-entity-row.ts
@@ -50,7 +50,7 @@ class HuiTextEntityRow extends LitElement implements LovelaceRow {
       <hui-generic-entity-row
         .hass=${this.hass}
         .config=${this._config}
-        hideName
+        hide-name
       >
         <ha-textfield
           .label=${this._config.name || computeStateName(stateObj)}
diff --git a/src/panels/map/ha-panel-map.ts b/src/panels/map/ha-panel-map.ts
index fdd0d8d07d2a..811a047c4551 100644
--- a/src/panels/map/ha-panel-map.ts
+++ b/src/panels/map/ha-panel-map.ts
@@ -39,8 +39,8 @@ class HaPanelMap extends LitElement {
         <ha-map
           .hass=${this.hass}
           .entities=${this._entities}
-          autoFit
-          interactiveZones
+          auto-fit
+          interactive-zones
         ></ha-map>
       </ha-top-app-bar-fixed>
     `;
diff --git a/src/panels/profile/ha-pick-language-row.ts b/src/panels/profile/ha-pick-language-row.ts
index eb5fa06d6178..09ccbb9a6faf 100644
--- a/src/panels/profile/ha-pick-language-row.ts
+++ b/src/panels/profile/ha-pick-language-row.ts
@@ -27,7 +27,7 @@ export class HaPickLanguageRow extends LitElement {
         </span>
         <ha-language-picker
           .hass=${this.hass}
-          nativeName
+          native-name
           .label=${this.hass.localize(
             "ui.panel.profile.language.dropdown_label"
           )}
diff --git a/src/panels/todo/dialog-todo-item-editor.ts b/src/panels/todo/dialog-todo-item-editor.ts
index 93e2fab805e6..880f74cafa3b 100644
--- a/src/panels/todo/dialog-todo-item-editor.ts
+++ b/src/panels/todo/dialog-todo-item-editor.ts
@@ -168,7 +168,7 @@ class DialogTodoItemEditor extends LitElement {
                     .locale=${this.hass.locale}
                     .disabled=${!canUpdate}
                     @value-changed=${this._dueDateChanged}
-                    canClear
+                    can-clear
                   ></ha-date-input>
                   ${this._todoListSupportsFeature(
                     TodoListEntityFeature.SET_DUE_DATETIME_ON_ITEM
diff --git a/src/state-summary/state-card-content.ts b/src/state-summary/state-card-content.ts
index f2c72f72828e..b2c87e8749bc 100644
--- a/src/state-summary/state-card-content.ts
+++ b/src/state-summary/state-card-content.ts
@@ -36,7 +36,7 @@ class StateCardContent extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render() {
     let stateCard: string;

From 8579bee053dc31a8db77beda46cac728fcba5cdb Mon Sep 17 00:00:00 2001
From: Petar Petrov <MindFreeze@users.noreply.github.com>
Date: Fri, 6 Dec 2024 15:58:04 +0200
Subject: [PATCH 02/12] Don't allow any more eslint warnings (#23181)

---
 eslint.config.mjs | 14 +++++++-------
 package.json      |  2 +-
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/eslint.config.mjs b/eslint.config.mjs
index 34169498b060..89a9ef605074 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -114,7 +114,7 @@ export default [
       "@typescript-eslint/no-shadow": ["error"],
 
       "@typescript-eslint/naming-convention": [
-        "warn",
+        "error",
         {
           selector: ["objectLiteralProperty", "objectLiteralMethod"],
           format: null,
@@ -162,16 +162,16 @@ export default [
       ],
 
       "unused-imports/no-unused-imports": "error",
-      "lit/attribute-names": "warn",
+      "lit/attribute-names": "error",
       "lit/attribute-value-entities": "off",
       "lit/no-template-map": "off",
-      "lit/no-native-attributes": "warn",
-      "lit/no-this-assign-in-render": "warn",
+      "lit/no-native-attributes": "error",
+      "lit/no-this-assign-in-render": "error",
       "lit-a11y/click-events-have-key-events": ["off"],
       "lit-a11y/no-autofocus": "off",
-      "lit-a11y/alt-text": "warn",
-      "lit-a11y/anchor-is-valid": "warn",
-      "lit-a11y/role-has-required-aria-attrs": "warn",
+      "lit-a11y/alt-text": "error",
+      "lit-a11y/anchor-is-valid": "error",
+      "lit-a11y/role-has-required-aria-attrs": "error",
       "@typescript-eslint/consistent-type-imports": "error",
       "@typescript-eslint/no-import-type-side-effects": "error",
     },
diff --git a/package.json b/package.json
index dcda881b5663..fcc47e201791 100644
--- a/package.json
+++ b/package.json
@@ -8,7 +8,7 @@
   "version": "1.0.0",
   "scripts": {
     "build": "script/build_frontend",
-    "lint:eslint": "eslint --flag unstable_config_lookup_from_file \"**/src/**/*.{js,ts,html}\" --cache --cache-strategy=content --cache-location=node_modules/.cache/eslint/.eslintcache --ignore-pattern=.gitignore",
+    "lint:eslint": "eslint --flag unstable_config_lookup_from_file \"**/src/**/*.{js,ts,html}\" --cache --cache-strategy=content --cache-location=node_modules/.cache/eslint/.eslintcache --ignore-pattern=.gitignore --max-warnings=0",
     "format:eslint": "eslint --flag unstable_config_lookup_from_file \"**/src/**/*.{js,ts,html}\" --cache --cache-strategy=content --cache-location=node_modules/.cache/eslint/.eslintcache --ignore-pattern=.gitignore --fix",
     "lint:prettier": "prettier . --cache --check",
     "format:prettier": "prettier . --cache --write",

From 0b7af715a833fcd916f7f7efacd890431e62b32a Mon Sep 17 00:00:00 2001
From: Bram Kragten <mail@bramkragten.nl>
Date: Fri, 6 Dec 2024 16:14:30 +0100
Subject: [PATCH 03/12] Fix label selector when required (#23186)

---
 src/components/ha-form/compute-initial-ha-form-data.ts | 2 ++
 src/components/ha-selector/ha-selector-label.ts        | 2 ++
 2 files changed, 4 insertions(+)

diff --git a/src/components/ha-form/compute-initial-ha-form-data.ts b/src/components/ha-form/compute-initial-ha-form-data.ts
index b74ad95fe906..53e348832875 100644
--- a/src/components/ha-form/compute-initial-ha-form-data.ts
+++ b/src/components/ha-form/compute-initial-ha-form-data.ts
@@ -47,6 +47,8 @@ export const computeInitialHaFormData = (
         data[field.name] = selector.entity?.multiple ? [] : "";
       } else if ("area" in selector) {
         data[field.name] = selector.area?.multiple ? [] : "";
+      } else if ("label" in selector) {
+        data[field.name] = selector.label?.multiple ? [] : "";
       } else if ("boolean" in selector) {
         data[field.name] = false;
       } else if (
diff --git a/src/components/ha-selector/ha-selector-label.ts b/src/components/ha-selector/ha-selector-label.ts
index 72a5d8ee57b0..d2b40986833e 100644
--- a/src/components/ha-selector/ha-selector-label.ts
+++ b/src/components/ha-selector/ha-selector-label.ts
@@ -34,6 +34,7 @@ export class HaLabelSelector extends LitElement {
           no-add
           .hass=${this.hass}
           .value=${ensureArray(this.value ?? [])}
+          .required=${this.required}
           .disabled=${this.disabled}
           .label=${this.label}
           @value-changed=${this._handleChange}
@@ -46,6 +47,7 @@ export class HaLabelSelector extends LitElement {
         no-add
         .hass=${this.hass}
         .value=${this.value}
+        .required=${this.required}
         .disabled=${this.disabled}
         .label=${this.label}
         @value-changed=${this._handleChange}

From ea5bf177804f3eb9d6c4bac02d32bd9e31213066 Mon Sep 17 00:00:00 2001
From: Paul Bottein <paul.bottein@gmail.com>
Date: Fri, 6 Dec 2024 16:16:33 +0100
Subject: [PATCH 04/12] Fix has-secondary attribute (#23187)

---
 src/components/ha-navigation-list.ts                  | 3 ++-
 src/panels/config/core/ha-config-system-navigation.ts | 2 +-
 src/panels/config/dashboard/ha-config-navigation.ts   | 2 +-
 3 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/ha-navigation-list.ts b/src/components/ha-navigation-list.ts
index 16139441ba7a..65cd96509219 100644
--- a/src/components/ha-navigation-list.ts
+++ b/src/components/ha-navigation-list.ts
@@ -19,7 +19,8 @@ class HaNavigationList extends LitElement {
 
   @property({ attribute: false }) public pages!: PageNavigation[];
 
-  @property({ attribute: false, type: Boolean }) public hasSecondary = false;
+  @property({ attribute: "has-secondary", type: Boolean })
+  public hasSecondary = false;
 
   @property() public label?: string;
 
diff --git a/src/panels/config/core/ha-config-system-navigation.ts b/src/panels/config/core/ha-config-system-navigation.ts
index 4065996f4cdc..d15a0f35b9bf 100644
--- a/src/panels/config/core/ha-config-system-navigation.ts
+++ b/src/panels/config/core/ha-config-system-navigation.ts
@@ -139,7 +139,7 @@ class HaConfigSystemNavigation extends LitElement {
               .hass=${this.hass}
               .narrow=${this.narrow}
               .pages=${pages}
-              hasSecondary
+              has-secondary
               .label=${this.hass.localize(
                 "ui.panel.config.dashboard.system.main"
               )}
diff --git a/src/panels/config/dashboard/ha-config-navigation.ts b/src/panels/config/dashboard/ha-config-navigation.ts
index fcabf2148e15..0b0f926dadfb 100644
--- a/src/panels/config/dashboard/ha-config-navigation.ts
+++ b/src/panels/config/dashboard/ha-config-navigation.ts
@@ -57,7 +57,7 @@ class HaConfigNavigation extends LitElement {
       }));
     return html`
       <ha-navigation-list
-        hasSecondary
+        has-secondary
         .hass=${this.hass}
         .narrow=${this.narrow}
         .pages=${pages}

From 6934f0626c7543edbfc619008d87d6bb699c72e8 Mon Sep 17 00:00:00 2001
From: Paul Bottein <paul.bottein@gmail.com>
Date: Fri, 6 Dec 2024 18:39:34 +0100
Subject: [PATCH 05/12] Fix boolean attributes (#23189)

---
 gallery/src/components/demo-card.ts           |  3 +-
 gallery/src/components/demo-more-info.ts      |  3 +-
 hassio/src/backups/hassio-backups.ts          |  2 +-
 hassio/src/components/hassio-card-content.ts  |  2 +-
 .../components/supervisor-backup-content.ts   |  5 ++-
 .../src/ingress-view/hassio-ingress-view.ts   |  2 +-
 src/auth/ha-auth-flow.ts                      |  2 +-
 src/components/chart/ha-chart-base.ts         |  3 +-
 .../chart/state-history-chart-line.ts         | 12 ++++---
 .../chart/state-history-chart-timeline.ts     |  5 +--
 src/components/chart/state-history-charts.ts  | 14 ++++----
 src/components/chart/statistics-chart.ts      | 14 ++++----
 src/components/data-table/ha-data-table.ts    |  2 +-
 src/components/entity/ha-entity-picker.ts     |  3 +-
 src/components/entity/ha-state-label-badge.ts |  2 +-
 src/components/entity/state-info.ts           |  6 ++--
 src/components/ha-assist-pipeline-picker.ts   |  2 +-
 src/components/ha-base-time-input.ts          | 14 +++++---
 src/components/ha-button-toggle-group.ts      |  3 +-
 src/components/ha-clickable-list-item.ts      |  5 +--
 src/components/ha-country-picker.ts           |  2 +-
 src/components/ha-date-range-picker.ts        | 11 +++---
 src/components/ha-domain-icon.ts              |  3 +-
 src/components/ha-duration-input.ts           | 11 +++---
 src/components/ha-filter-domains.ts           |  2 +-
 src/components/ha-filter-integrations.ts      |  2 +-
 src/components/ha-markdown-element.ts         |  2 +-
 src/components/ha-markdown.ts                 |  2 +-
 src/components/ha-password-field.ts           | 34 ++++++++++++-------
 .../ha-selector/ha-selector-duration.ts       |  4 +--
 src/components/ha-service-control.ts          |  3 +-
 src/components/ha-sidebar.ts                  |  6 ++--
 src/components/ha-target-picker.ts            |  2 +-
 src/components/ha-theme-picker.ts             |  3 +-
 .../ha-two-pane-top-app-bar-fixed.ts          |  2 +-
 src/components/map/ha-locations-editor.ts     |  2 +-
 src/components/map/ha-map.ts                  |  2 +-
 src/components/trace/ha-timeline.ts           |  2 +-
 src/components/trace/hat-trace-timeline.ts    |  2 +-
 .../more-info/controls/more-info-script.ts    |  3 +-
 src/layouts/hass-tabs-subpage-data-table.ts   |  9 ++---
 src/onboarding/integration-badge.ts           |  4 +--
 src/onboarding/onboarding-welcome-links.ts    |  3 +-
 .../calendar/ha-recurrence-rule-editor.ts     |  2 +-
 .../ha-config-application-credentials.ts      |  2 +-
 .../config/areas/ha-config-area-page.ts       |  4 +--
 .../config/areas/ha-config-areas-dashboard.ts |  2 +-
 src/panels/config/areas/ha-config-areas.ts    |  4 +--
 .../add-automation-element-dialog.ts          |  2 +-
 .../ha-automation-condition-editor.ts         |  2 +-
 .../config/automation/ha-automation-editor.ts |  2 +-
 .../config/automation/ha-automation-picker.ts |  2 +-
 .../config/automation/ha-automation-trace.ts  |  2 +-
 .../config/automation/ha-config-automation.ts |  4 +--
 .../automation/manual-automation-editor.ts    |  2 +-
 src/panels/config/backup/ha-config-backup.ts  |  2 +-
 .../blueprint/blueprint-generic-editor.ts     |  2 +-
 .../config/blueprint/ha-blueprint-overview.ts |  2 +-
 .../config/blueprint/ha-config-blueprint.ts   |  4 +--
 .../config/cloud/account/cloud-account.ts     |  2 +-
 src/panels/config/cloud/ha-config-cloud.ts    |  2 +-
 src/panels/config/cloud/login/cloud-login.ts  |  2 +-
 .../config/cloud/register/cloud-register.ts   |  2 +-
 .../core/ha-config-system-navigation.ts       |  4 +--
 .../config/dashboard/ha-config-dashboard.ts   |  4 +--
 .../device-detail/ha-device-entities-card.ts  |  3 +-
 .../mqtt/mqtt-discovery-payload.ts            |  3 +-
 .../mqtt/mqtt-messages.ts                     |  7 ++--
 .../config/devices/ha-config-device-page.ts   |  4 +--
 .../devices/ha-config-devices-dashboard.ts    |  2 +-
 .../config/devices/ha-config-devices.ts       |  4 +--
 src/panels/config/energy/ha-config-energy.ts  |  4 +--
 .../config/entities/ha-config-entities.ts     |  2 +-
 src/panels/config/ha-config-section.ts        |  2 +-
 .../config/hardware/ha-config-hardware.ts     |  2 +-
 .../config/helpers/ha-config-helpers.ts       |  2 +-
 src/panels/config/info/ha-config-info.ts      |  6 ++--
 .../ha-config-integration-page.ts             |  4 +--
 .../ha-config-integrations-dashboard.ts       |  4 +--
 .../integrations/ha-config-integrations.ts    |  4 +--
 .../integrations/ha-integration-card.ts       |  2 +-
 .../integrations/ha-integration-list-item.ts  |  3 +-
 .../matter/matter-config-panel.ts             |  2 +-
 .../zha/zha-add-devices-page.ts               |  2 +-
 .../zha/zha-cluster-commands.ts               |  2 +-
 .../zha/zha-config-dashboard-router.ts        |  2 +-
 .../zha/zha-config-dashboard.ts               |  2 +-
 .../integration-panels/zha/zha-group-page.ts  |  2 +-
 .../zha/zha-groups-dashboard.ts               |  2 +-
 .../zha/zha-manage-clusters.ts                |  2 +-
 .../zha/zha-network-visualization-page.ts     |  2 +-
 .../zwave_js/zwave_js-config-dashboard.ts     |  2 +-
 .../zwave_js/zwave_js-config-router.ts        |  2 +-
 .../zwave_js/zwave_js-node-config.ts          |  2 +-
 .../zwave_js/zwave_js-node-installer.ts       |  2 +-
 src/panels/config/labels/ha-config-labels.ts  |  2 +-
 src/panels/config/logs/ha-config-logs.ts      |  2 +-
 .../ha-config-lovelace-dashboards.ts          |  2 +-
 .../config/lovelace/ha-config-lovelace.ts     |  2 +-
 .../resources/ha-config-lovelace-resources.ts |  2 +-
 src/panels/config/person/ha-config-person.ts  |  2 +-
 .../repairs/integrations-startup-time.ts      |  2 +-
 src/panels/config/scene/ha-config-scene.ts    |  4 +--
 src/panels/config/scene/ha-scene-dashboard.ts |  2 +-
 src/panels/config/scene/ha-scene-editor.ts    |  4 +--
 src/panels/config/script/ha-config-script.ts  |  4 +--
 src/panels/config/script/ha-script-editor.ts  |  2 +-
 src/panels/config/script/ha-script-picker.ts  |  2 +-
 src/panels/config/script/ha-script-trace.ts   |  2 +-
 .../config/script/manual-script-editor.ts     |  2 +-
 src/panels/config/tags/ha-config-tags.ts      |  2 +-
 src/panels/config/users/ha-config-users.ts    |  2 +-
 .../ha-config-voice-assistants-assistants.ts  |  2 +-
 .../ha-config-voice-assistants-expose.ts      |  2 +-
 .../ha-config-voice-assistants.ts             |  2 +-
 src/panels/config/zone/ha-config-zone.ts      |  2 +-
 .../developer-yaml-config.ts                  |  4 +--
 src/panels/history/ha-panel-history.ts        |  4 +--
 src/panels/logbook/ha-logbook.ts              |  3 +-
 src/panels/logbook/ha-panel-logbook.ts        |  2 +-
 .../hui-energy-devices-detail-graph-card.ts   |  2 +-
 .../components/hui-badge-edit-mode.ts         |  3 +-
 .../lovelace/components/hui-card-options.ts   |  3 +-
 .../components/hui-energy-period-selector.ts  |  2 +-
 .../components/hui-generic-entity-row.ts      |  3 +-
 .../editor/hui-entities-card-row-editor.ts    |  2 +-
 .../editor/view-editor/hui-view-editor.ts     |  2 +-
 .../elements/hui-state-badge-element.ts       |  2 +-
 .../lovelace/sections/hui-error-section.ts    |  2 +-
 .../lovelace/sections/hui-grid-section.ts     | 10 +++---
 src/panels/lovelace/views/hui-masonry-view.ts |  2 +-
 src/panels/lovelace/views/hui-panel-view.ts   |  2 +-
 .../lovelace/views/hui-sections-view.ts       |  2 +-
 src/panels/lovelace/views/hui-sidebar-view.ts |  2 +-
 src/panels/profile/ha-change-password-card.ts |  4 +--
 src/state-summary/state-card-alert.ts         |  2 +-
 src/state-summary/state-card-button.ts        |  2 +-
 src/state-summary/state-card-climate.ts       |  2 +-
 src/state-summary/state-card-configurator.ts  |  2 +-
 src/state-summary/state-card-cover.ts         |  2 +-
 src/state-summary/state-card-display.ts       |  2 +-
 src/state-summary/state-card-event.ts         |  2 +-
 src/state-summary/state-card-humidifier.ts    |  2 +-
 src/state-summary/state-card-input_button.ts  |  2 +-
 src/state-summary/state-card-input_number.ts  |  2 +-
 src/state-summary/state-card-input_text.ts    |  3 +-
 src/state-summary/state-card-lawn_mower.ts    |  2 +-
 src/state-summary/state-card-lock.ts          |  2 +-
 src/state-summary/state-card-media_player.ts  |  2 +-
 src/state-summary/state-card-number.ts        |  2 +-
 src/state-summary/state-card-scene.ts         |  2 +-
 src/state-summary/state-card-script.ts        |  2 +-
 src/state-summary/state-card-timer.ts         |  2 +-
 src/state-summary/state-card-toggle.ts        |  2 +-
 src/state-summary/state-card-update.ts        |  2 +-
 src/state-summary/state-card-vacuum.ts        |  2 +-
 src/state-summary/state-card-water_heater.ts  |  2 +-
 157 files changed, 275 insertions(+), 234 deletions(-)

diff --git a/gallery/src/components/demo-card.ts b/gallery/src/components/demo-card.ts
index 50234d11515f..584b32e32f14 100644
--- a/gallery/src/components/demo-card.ts
+++ b/gallery/src/components/demo-card.ts
@@ -18,7 +18,8 @@ class DemoCard extends LitElement {
 
   @property({ attribute: false }) public config!: DemoCardConfig;
 
-  @property({ attribute: false, type: Boolean }) public showConfig = false;
+  @property({ attribute: "show-config", type: Boolean })
+  public showConfig = false;
 
   @state() private _size?: number;
 
diff --git a/gallery/src/components/demo-more-info.ts b/gallery/src/components/demo-more-info.ts
index 5e39ab9eac6f..0b6223531eb3 100644
--- a/gallery/src/components/demo-more-info.ts
+++ b/gallery/src/components/demo-more-info.ts
@@ -12,7 +12,8 @@ class DemoMoreInfo extends LitElement {
 
   @property({ attribute: false }) public entityId!: string;
 
-  @property({ attribute: false, type: Boolean }) public showConfig = false;
+  @property({ attribute: "show-config", type: Boolean })
+  public showConfig = false;
 
   render() {
     const state = this._getState(this.entityId, this.hass.states);
diff --git a/hassio/src/backups/hassio-backups.ts b/hassio/src/backups/hassio-backups.ts
index 1250e62f886f..9a8116394129 100644
--- a/hassio/src/backups/hassio-backups.ts
+++ b/hassio/src/backups/hassio-backups.ts
@@ -58,7 +58,7 @@ export class HassioBackups extends LitElement {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @state() private _selectedBackups: string[] = [];
 
diff --git a/hassio/src/components/hassio-card-content.ts b/hassio/src/components/hassio-card-content.ts
index e9f3872e07bb..8f0b9fc123f5 100644
--- a/hassio/src/components/hassio-card-content.ts
+++ b/hassio/src/components/hassio-card-content.ts
@@ -16,7 +16,7 @@ class HassioCardContent extends LitElement {
 
   @property({ type: Boolean }) public available = true;
 
-  @property({ attribute: false, type: Boolean }) public showTopbar = false;
+  @property({ attribute: false }) public showTopbar = false;
 
   @property({ attribute: false }) public topbarClass?: string;
 
diff --git a/hassio/src/components/supervisor-backup-content.ts b/hassio/src/components/supervisor-backup-content.ts
index 03d1667d6ab2..a4491c3e800b 100644
--- a/hassio/src/components/supervisor-backup-content.ts
+++ b/hassio/src/components/supervisor-backup-content.ts
@@ -80,10 +80,9 @@ export class SupervisorBackupContent extends LitElement {
 
   @property({ attribute: false }) public addons?: AddonCheckboxItem[];
 
-  @property({ attribute: false, type: Boolean }) public homeAssistant = false;
+  @property({ attribute: false }) public homeAssistant = false;
 
-  @property({ attribute: false, type: Boolean }) public backupHasPassword =
-    false;
+  @property({ attribute: false }) public backupHasPassword = false;
 
   @property({ type: Boolean }) public onboarding = false;
 
diff --git a/hassio/src/ingress-view/hassio-ingress-view.ts b/hassio/src/ingress-view/hassio-ingress-view.ts
index 98e62b4fafcf..b969a37b9faf 100644
--- a/hassio/src/ingress-view/hassio-ingress-view.ts
+++ b/hassio/src/ingress-view/hassio-ingress-view.ts
@@ -34,7 +34,7 @@ class HassioIngressView extends LitElement {
 
   @property({ attribute: false }) public route!: Route;
 
-  @property({ attribute: false, type: Boolean }) public ingressPanel = false;
+  @property({ attribute: false }) public ingressPanel = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/auth/ha-auth-flow.ts b/src/auth/ha-auth-flow.ts
index e12dcda037a1..2adce4d34786 100644
--- a/src/auth/ha-auth-flow.ts
+++ b/src/auth/ha-auth-flow.ts
@@ -40,7 +40,7 @@ export class HaAuthFlow extends LitElement {
 
   @property({ attribute: false }) public step?: DataEntryFlowStep;
 
-  @property({ attribute: false, type: Boolean }) public initStoreToken = false;
+  @property({ attribute: false }) public initStoreToken = false;
 
   @state() private _storeToken = false;
 
diff --git a/src/components/chart/ha-chart-base.ts b/src/components/chart/ha-chart-base.ts
index d219139741bf..69cbac9a7b6f 100644
--- a/src/components/chart/ha-chart-base.ts
+++ b/src/components/chart/ha-chart-base.ts
@@ -55,7 +55,8 @@ export class HaChartBase extends LitElement {
 
   @property({ attribute: false, type: Number }) public paddingYAxis = 0;
 
-  @property({ attribute: false, type: Boolean }) public externalHidden = false;
+  @property({ attribute: "external-hidden", type: Boolean })
+  public externalHidden = false;
 
   @state() private _chartHeight?: number;
 
diff --git a/src/components/chart/state-history-chart-line.ts b/src/components/chart/state-history-chart-line.ts
index 85495c77f3df..afa913a4bed6 100644
--- a/src/components/chart/state-history-chart-line.ts
+++ b/src/components/chart/state-history-chart-line.ts
@@ -32,9 +32,11 @@ export class StateHistoryChartLine extends LitElement {
 
   @property() public identifier?: string;
 
-  @property({ attribute: false, type: Boolean }) public showNames = true;
+  @property({ attribute: "show-names", type: Boolean })
+  public showNames = true;
 
-  @property({ attribute: false, type: Boolean }) public clickForMoreInfo = true;
+  @property({ attribute: "click-for-more-info", type: Boolean })
+  public clickForMoreInfo = true;
 
   @property({ attribute: false }) public startTime!: Date;
 
@@ -44,14 +46,14 @@ export class StateHistoryChartLine extends LitElement {
 
   @property({ attribute: false, type: Number }) public chartIndex?;
 
-  @property({ attribute: false, type: Boolean }) public logarithmicScale =
-    false;
+  @property({ attribute: "logarithmic-scale", type: Boolean })
+  public logarithmicScale = false;
 
   @property({ attribute: false, type: Number }) public minYAxis?: number;
 
   @property({ attribute: false, type: Number }) public maxYAxis?: number;
 
-  @property({ attribute: false, type: Boolean }) public fitYData = false;
+  @property({ attribute: "fit-y-data", type: Boolean }) public fitYData = false;
 
   @state() private _chartData?: ChartData<"line">;
 
diff --git a/src/components/chart/state-history-chart-timeline.ts b/src/components/chart/state-history-chart-timeline.ts
index f8d19d3cb4a4..f619bea3b8f0 100644
--- a/src/components/chart/state-history-chart-timeline.ts
+++ b/src/components/chart/state-history-chart-timeline.ts
@@ -30,9 +30,10 @@ export class StateHistoryChartTimeline extends LitElement {
 
   @property() public identifier?: string;
 
-  @property({ attribute: false, type: Boolean }) public showNames = true;
+  @property({ attribute: "show-names", type: Boolean }) public showNames = true;
 
-  @property({ attribute: false, type: Boolean }) public clickForMoreInfo = true;
+  @property({ attribute: "click-for-more-info", type: Boolean })
+  public clickForMoreInfo = true;
 
   @property({ type: Boolean }) public chunked = false;
 
diff --git a/src/components/chart/state-history-charts.ts b/src/components/chart/state-history-charts.ts
index c701167302fa..fb4ec0d4d391 100644
--- a/src/components/chart/state-history-charts.ts
+++ b/src/components/chart/state-history-charts.ts
@@ -61,20 +61,22 @@ export class StateHistoryCharts extends LitElement {
 
   @property({ attribute: false, type: Number }) public hoursToShow?: number;
 
-  @property({ attribute: false, type: Boolean }) public showNames = true;
+  @property({ attribute: "show-names", type: Boolean }) public showNames = true;
 
-  @property({ attribute: false, type: Boolean }) public clickForMoreInfo = true;
+  @property({ attribute: "click-for-more-info", type: Boolean })
+  public clickForMoreInfo = true;
 
-  @property({ attribute: false, type: Boolean }) public isLoadingData = false;
+  @property({ attribute: "is-loading-data", type: Boolean })
+  public isLoadingData = false;
 
-  @property({ attribute: false, type: Boolean }) public logarithmicScale =
-    false;
+  @property({ attribute: "logarithmic-scale", type: Boolean })
+  public logarithmicScale = false;
 
   @property({ attribute: false, type: Number }) public minYAxis?: number;
 
   @property({ attribute: false, type: Number }) public maxYAxis?: number;
 
-  @property({ attribute: false, type: Boolean }) public fitYData = false;
+  @property({ attribute: "fit-y-data", type: Boolean }) public fitYData = false;
 
   private _computedStartTime!: Date;
 
diff --git a/src/components/chart/statistics-chart.ts b/src/components/chart/statistics-chart.ts
index d1e2ac5e7610..3673ec8cf5a8 100644
--- a/src/components/chart/statistics-chart.ts
+++ b/src/components/chart/statistics-chart.ts
@@ -72,17 +72,19 @@ export class StatisticsChart extends LitElement {
 
   @property({ attribute: false, type: Number }) public maxYAxis?: number;
 
-  @property({ attribute: false, type: Boolean }) public fitYData = false;
+  @property({ attribute: "fit-y-data", type: Boolean }) public fitYData = false;
 
   @property({ attribute: "hide-legend", type: Boolean }) public hideLegend =
     false;
 
-  @property({ attribute: false, type: Boolean }) public logarithmicScale =
-    false;
+  @property({ attribute: "logarithmic-scale", type: Boolean })
+  public logarithmicScale = false;
 
-  @property({ attribute: false, type: Boolean }) public isLoadingData = false;
+  @property({ attribute: "is-loading-data", type: Boolean })
+  public isLoadingData = false;
 
-  @property({ attribute: false, type: Boolean }) public clickForMoreInfo = true;
+  @property({ attribute: "click-for-more-info", type: Boolean })
+  public clickForMoreInfo = true;
 
   @property() public period?: string;
 
@@ -165,7 +167,7 @@ export class StatisticsChart extends LitElement {
 
     return html`
       <ha-chart-base
-        externalHidden
+        external-hidden
         .hass=${this.hass}
         .data=${this._chartData}
         .extraData=${this._chartDatasetExtra}
diff --git a/src/components/data-table/ha-data-table.ts b/src/components/data-table/ha-data-table.ts
index 9348104065d4..4278562171b3 100644
--- a/src/components/data-table/ha-data-table.ts
+++ b/src/components/data-table/ha-data-table.ts
@@ -116,7 +116,7 @@ export class HaDataTable extends LitElement {
 
   @property({ type: Boolean }) public clickable = false;
 
-  @property({ attribute: false, type: Boolean }) public hasFab = false;
+  @property({ attribute: "has-fab", type: Boolean }) public hasFab = false;
 
   /**
    * Add an extra row at the bottom of the data table
diff --git a/src/components/entity/ha-entity-picker.ts b/src/components/entity/ha-entity-picker.ts
index c245ee7b4502..a4a657f525a7 100644
--- a/src/components/entity/ha-entity-picker.ts
+++ b/src/components/entity/ha-entity-picker.ts
@@ -103,7 +103,8 @@ export class HaEntityPicker extends LitElement {
   @property({ attribute: false })
   public entityFilter?: HaEntityPickerEntityFilterFunc;
 
-  @property({ attribute: false, type: Boolean }) public hideClearIcon = false;
+  @property({ attribute: "hide-clear-icon", type: Boolean })
+  public hideClearIcon = false;
 
   @property({ attribute: "item-label-path" }) public itemLabelPath =
     "friendly_name";
diff --git a/src/components/entity/ha-state-label-badge.ts b/src/components/entity/ha-state-label-badge.ts
index 872733751fe5..4f02fb94a531 100644
--- a/src/components/entity/ha-state-label-badge.ts
+++ b/src/components/entity/ha-state-label-badge.ts
@@ -55,7 +55,7 @@ export class HaStateLabelBadge extends LitElement {
 
   @property() public image?: string;
 
-  @property({ attribute: false, type: Boolean }) public showName = false;
+  @property({ attribute: "show-name", type: Boolean }) public showName = false;
 
   @state() private _timerTimeRemaining?: number;
 
diff --git a/src/components/entity/state-info.ts b/src/components/entity/state-info.ts
index f6edee605c79..8822ca2d02df 100644
--- a/src/components/entity/state-info.ts
+++ b/src/components/entity/state-info.ts
@@ -14,7 +14,7 @@ class StateInfo extends LitElement {
 
   @property({ attribute: false }) public stateObj?: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   @property() public color?: string;
 
@@ -32,7 +32,7 @@ class StateInfo extends LitElement {
         .color=${this.color}
       ></state-badge>
       <div class="info">
-        <div class="name" .title=${name} .inDialog=${this.inDialog}>
+        <div class="name ${this.inDialog ? "in-dialog" : ""}" .title=${name}>
           ${name}
         </div>
         ${this.inDialog
@@ -108,7 +108,7 @@ class StateInfo extends LitElement {
         text-overflow: ellipsis;
       }
 
-      .name[inDialog],
+      .name.in-dialog,
       :host([secondary-line]) .name {
         line-height: 20px;
       }
diff --git a/src/components/ha-assist-pipeline-picker.ts b/src/components/ha-assist-pipeline-picker.ts
index 09ead83b80f7..ebfd33c691f1 100644
--- a/src/components/ha-assist-pipeline-picker.ts
+++ b/src/components/ha-assist-pipeline-picker.ts
@@ -26,7 +26,7 @@ export class HaAssistPipelinePicker extends LitElement {
 
   @property({ type: Boolean }) public required = false;
 
-  @property({ attribute: false, type: Boolean }) public includeLastUsed = false;
+  @property({ attribute: false }) public includeLastUsed = false;
 
   @state() _pipelines?: AssistPipeline[];
 
diff --git a/src/components/ha-base-time-input.ts b/src/components/ha-base-time-input.ts
index 5a1629bb117b..c3e3fcc98529 100644
--- a/src/components/ha-base-time-input.ts
+++ b/src/components/ha-base-time-input.ts
@@ -36,7 +36,7 @@ export class HaBaseTimeInput extends LitElement {
   /**
    * auto validate time inputs
    */
-  @property({ attribute: false, type: Boolean }) autoValidate = false;
+  @property({ attribute: "auto-validate", type: Boolean }) autoValidate = false;
 
   /**
    * determines if inputs are required
@@ -106,22 +106,26 @@ export class HaBaseTimeInput extends LitElement {
   /**
    * show the sec field
    */
-  @property({ attribute: false, type: Boolean }) enableSecond = false;
+  @property({ attribute: "enable-second", type: Boolean })
+  public enableSecond = false;
 
   /**
    * show the milli sec field
    */
-  @property({ attribute: false, type: Boolean }) enableMillisecond = false;
+  @property({ attribute: "enable-millisecond", type: Boolean })
+  public enableMillisecond = false;
 
   /**
    * show the day field
    */
-  @property({ attribute: false, type: Boolean }) enableDay = false;
+  @property({ attribute: "enable-day", type: Boolean })
+  public enableDay = false;
 
   /**
    * limit hours input
    */
-  @property({ attribute: false, type: Boolean }) noHoursLimit = false;
+  @property({ attribute: "no-hours-limit", type: Boolean })
+  public noHoursLimit = false;
 
   /**
    * AM or PM
diff --git a/src/components/ha-button-toggle-group.ts b/src/components/ha-button-toggle-group.ts
index 69c92070b5fe..7ec98e8e6828 100644
--- a/src/components/ha-button-toggle-group.ts
+++ b/src/components/ha-button-toggle-group.ts
@@ -14,7 +14,8 @@ export class HaButtonToggleGroup extends LitElement {
 
   @property() public active?: string;
 
-  @property({ attribute: false, type: Boolean }) public fullWidth = false;
+  @property({ attribute: "full-width", type: Boolean })
+  public fullWidth = false;
 
   @property({ type: Boolean }) public dense = false;
 
diff --git a/src/components/ha-clickable-list-item.ts b/src/components/ha-clickable-list-item.ts
index e50b6cf5aa87..d68c7d4b0c61 100644
--- a/src/components/ha-clickable-list-item.ts
+++ b/src/components/ha-clickable-list-item.ts
@@ -7,9 +7,10 @@ import { HaListItem } from "./ha-list-item";
 export class HaClickableListItem extends HaListItem {
   @property() public href?: string;
 
-  @property({ attribute: false, type: Boolean }) public disableHref = false;
+  @property({ attribute: "disable-href", type: Boolean })
+  public disableHref = false;
 
-  @property({ attribute: false, type: Boolean, reflect: true })
+  @property({ attribute: "open-new-tab", type: Boolean, reflect: true })
   public openNewTab = false;
 
   @query("a") private _anchor!: HTMLAnchorElement;
diff --git a/src/components/ha-country-picker.ts b/src/components/ha-country-picker.ts
index a84e96af6570..4e213ad8639e 100644
--- a/src/components/ha-country-picker.ts
+++ b/src/components/ha-country-picker.ts
@@ -277,7 +277,7 @@ export class HaCountryPicker extends LitElement {
 
   @property({ type: Boolean, reflect: true }) public disabled = false;
 
-  @property({ attribute: false, type: Boolean }) public noSort = false;
+  @property({ attribute: "no-sort", type: Boolean }) public noSort = false;
 
   private _getOptions = memoizeOne(
     (language?: string, countries?: string[]) => {
diff --git a/src/components/ha-date-range-picker.ts b/src/components/ha-date-range-picker.ts
index ef661583f33c..12601e2a4b50 100644
--- a/src/components/ha-date-range-picker.ts
+++ b/src/components/ha-date-range-picker.ts
@@ -53,17 +53,20 @@ export class HaDateRangePicker extends LitElement {
 
   @state() private _ranges?: DateRangePickerRanges;
 
-  @property({ attribute: false, type: Boolean }) public autoApply = false;
+  @property({ attribute: "auto-apply", type: Boolean })
+  public autoApply = false;
 
-  @property({ attribute: false, type: Boolean }) public timePicker = true;
+  @property({ attribute: "time-picker", type: Boolean })
+  public timePicker = true;
 
-  @property({ attribute: false, type: Boolean }) public disabled = false;
+  @property({ type: Boolean }) public disabled = false;
 
   @property({ type: Boolean }) public minimal = false;
 
   @state() private _hour24format = false;
 
-  @property({ attribute: false, type: Boolean }) public extendedPresets = false;
+  @property({ attribute: "extended-presets", type: Boolean })
+  public extendedPresets = false;
 
   @property({ attribute: false }) public openingDirection?:
     | "right"
diff --git a/src/components/ha-domain-icon.ts b/src/components/ha-domain-icon.ts
index 7d85f53ed8cf..301a5cb1eaf4 100644
--- a/src/components/ha-domain-icon.ts
+++ b/src/components/ha-domain-icon.ts
@@ -18,7 +18,8 @@ export class HaDomainIcon extends LitElement {
 
   @property() public icon?: string;
 
-  @property({ attribute: false, type: Boolean }) public brandFallback?: boolean;
+  @property({ attribute: "brand-fallback", type: Boolean })
+  public brandFallback?: boolean;
 
   protected render() {
     if (this.icon) {
diff --git a/src/components/ha-duration-input.ts b/src/components/ha-duration-input.ts
index 6306a926626a..6ecc9dddc680 100644
--- a/src/components/ha-duration-input.ts
+++ b/src/components/ha-duration-input.ts
@@ -23,10 +23,11 @@ class HaDurationInput extends LitElement {
 
   @property({ type: Boolean }) public required = false;
 
-  @property({ attribute: false, type: Boolean }) public enableMillisecond =
-    false;
+  @property({ attribute: "enable-millisecond", type: Boolean })
+  public enableMillisecond = false;
 
-  @property({ attribute: false, type: Boolean }) public enableDay = false;
+  @property({ attribute: "enable-day", type: Boolean })
+  public enableDay = false;
 
   @property({ type: Boolean }) public disabled = false;
 
@@ -48,7 +49,7 @@ class HaDurationInput extends LitElement {
         .autoValidate=${this.required}
         .disabled=${this.disabled}
         errorMessage="Required"
-        enableSecond
+        enable-second
         .enableMillisecond=${this.enableMillisecond}
         .enableDay=${this.enableDay}
         format="24"
@@ -58,7 +59,7 @@ class HaDurationInput extends LitElement {
         .seconds=${this._seconds}
         .milliseconds=${this._milliseconds}
         @value-changed=${this._durationChanged}
-        noHoursLimit
+        no-hours-limit
         dayLabel="dd"
         hourLabel="hh"
         minLabel="mm"
diff --git a/src/components/ha-filter-domains.ts b/src/components/ha-filter-domains.ts
index b6e892bbbfce..9afced8baede 100644
--- a/src/components/ha-filter-domains.ts
+++ b/src/components/ha-filter-domains.ts
@@ -75,7 +75,7 @@ export class HaFilterDomains extends LitElement {
                         slot="graphic"
                         .hass=${this.hass}
                         .domain=${domain}
-                        brandFallback
+                        brand-fallback
                       ></ha-domain-icon>
                       ${domainToName(this.hass.localize, domain)}
                     </ha-check-list-item>`
diff --git a/src/components/ha-filter-integrations.ts b/src/components/ha-filter-integrations.ts
index 11e10d52442e..84c031421c7a 100644
--- a/src/components/ha-filter-integrations.ts
+++ b/src/components/ha-filter-integrations.ts
@@ -77,7 +77,7 @@ export class HaFilterIntegrations extends LitElement {
                         slot="graphic"
                         .hass=${this.hass}
                         .domain=${integration.domain}
-                        brandFallback
+                        brand-fallback
                       ></ha-domain-icon>
                       ${integration.name || integration.domain}
                     </ha-check-list-item>`
diff --git a/src/components/ha-markdown-element.ts b/src/components/ha-markdown-element.ts
index d2400b74ce21..128bb220bd16 100644
--- a/src/components/ha-markdown-element.ts
+++ b/src/components/ha-markdown-element.ts
@@ -19,7 +19,7 @@ const _gitHubMarkdownAlerts = {
 class HaMarkdownElement extends ReactiveElement {
   @property() public content?;
 
-  @property({ attribute: false, type: Boolean }) public allowSvg = false;
+  @property({ attribute: "allow-svg", type: Boolean }) public allowSvg = false;
 
   @property({ type: Boolean }) public breaks = false;
 
diff --git a/src/components/ha-markdown.ts b/src/components/ha-markdown.ts
index 52dbdb8f40ea..0e12ff0f3aea 100644
--- a/src/components/ha-markdown.ts
+++ b/src/components/ha-markdown.ts
@@ -7,7 +7,7 @@ import "./ha-markdown-element";
 export class HaMarkdown extends LitElement {
   @property() public content?;
 
-  @property({ attribute: false, type: Boolean }) public allowSvg = false;
+  @property({ attribute: "allow-svg", type: Boolean }) public allowSvg = false;
 
   @property({ type: Boolean }) public breaks = false;
 
diff --git a/src/components/ha-password-field.ts b/src/components/ha-password-field.ts
index 1323aaa06269..63b4e34be5e5 100644
--- a/src/components/ha-password-field.ts
+++ b/src/components/ha-password-field.ts
@@ -23,7 +23,8 @@ export class HaPasswordField extends LitElement {
 
   @property({ type: Boolean }) public icon = false;
 
-  @property({ attribute: false, type: Boolean }) public iconTrailing = false;
+  // eslint-disable-next-line lit/attribute-names
+  @property({ type: Boolean }) public iconTrailing = false;
 
   @property() public autocomplete?: string;
 
@@ -42,32 +43,38 @@ export class HaPasswordField extends LitElement {
 
   @property({ type: Boolean }) required = false;
 
-  @property({ attribute: false, type: Number }) minLength = -1;
+  // eslint-disable-next-line lit/attribute-names
+  @property({ type: Number }) minLength = -1;
 
-  @property({ attribute: false, type: Number }) maxLength = -1;
+  // eslint-disable-next-line lit/attribute-names
+  @property({ type: Number }) maxLength = -1;
 
   @property({ type: Boolean, reflect: true }) outlined = false;
 
   @property({ type: String }) helper = "";
 
-  @property({ attribute: false, type: Boolean }) validateOnInitialRender =
-    false;
+  // eslint-disable-next-line lit/attribute-names
+  @property({ type: Boolean }) validateOnInitialRender = false;
 
-  @property({ attribute: false, type: String }) validationMessage = "";
+  // eslint-disable-next-line lit/attribute-names
+  @property({ type: String }) validationMessage = "";
 
-  @property({ attribute: false, type: Boolean }) autoValidate = false;
+  // eslint-disable-next-line lit/attribute-names
+  @property({ type: Boolean }) autoValidate = false;
 
   @property({ type: String }) pattern = "";
 
   @property({ type: Number }) size: number | null = null;
 
-  @property({ attribute: false, type: Boolean }) helperPersistent = false;
+  // eslint-disable-next-line lit/attribute-names
+  @property({ type: Boolean }) helperPersistent = false;
 
-  @property({ attribute: false, type: Boolean }) charCounter:
-    | boolean
-    | TextAreaCharCounter = false;
+  // eslint-disable-next-line lit/attribute-names
+  @property({ type: Boolean }) charCounter: boolean | TextAreaCharCounter =
+    false;
 
-  @property({ attribute: false, type: Boolean }) endAligned = false;
+  // eslint-disable-next-line lit/attribute-names
+  @property({ type: Boolean }) endAligned = false;
 
   @property({ type: String }) prefix = "";
 
@@ -78,7 +85,8 @@ export class HaPasswordField extends LitElement {
   @property({ type: String, attribute: "input-mode" })
   inputMode!: string;
 
-  @property({ attribute: false, type: Boolean }) readOnly = false;
+  // eslint-disable-next-line lit/attribute-names
+  @property({ type: Boolean }) readOnly = false;
 
   // eslint-disable-next-line lit/no-native-attributes
   @property({ attribute: false, type: String }) autocapitalize = "";
diff --git a/src/components/ha-selector/ha-selector-duration.ts b/src/components/ha-selector/ha-selector-duration.ts
index 66f2e8d50db5..7fa96adf3e33 100644
--- a/src/components/ha-selector/ha-selector-duration.ts
+++ b/src/components/ha-selector/ha-selector-duration.ts
@@ -29,8 +29,8 @@ export class HaTimeDuration extends LitElement {
         .data=${this.value}
         .disabled=${this.disabled}
         .required=${this.required}
-        ?enableDay=${this.selector.duration?.enable_day}
-        ?enableMillisecond=${this.selector.duration?.enable_millisecond}
+        .enableDay=${this.selector.duration?.enable_day}
+        .enableMillisecond=${this.selector.duration?.enable_millisecond}
       ></ha-duration-input>
     `;
   }
diff --git a/src/components/ha-service-control.ts b/src/components/ha-service-control.ts
index dfc26ed559c1..4bb944932393 100644
--- a/src/components/ha-service-control.ts
+++ b/src/components/ha-service-control.ts
@@ -92,7 +92,8 @@ export class HaServiceControl extends LitElement {
   @property({ attribute: false, type: Boolean, reflect: true })
   public hidePicker = false;
 
-  @property({ attribute: false, type: Boolean }) public hideDescription = false;
+  @property({ attribute: "hide-description", type: Boolean })
+  public hideDescription = false;
 
   @state() private _value!: this["value"];
 
diff --git a/src/components/ha-sidebar.ts b/src/components/ha-sidebar.ts
index 3af1b5e4d8da..fe349178c1b9 100644
--- a/src/components/ha-sidebar.ts
+++ b/src/components/ha-sidebar.ts
@@ -184,9 +184,11 @@ class HaSidebar extends SubscribeMixin(LitElement) {
 
   @property({ attribute: false }) public route!: Route;
 
-  @property({ attribute: false, type: Boolean }) public alwaysExpand = false;
+  @property({ attribute: "always-expand", type: Boolean })
+  public alwaysExpand = false;
 
-  @property({ attribute: false, type: Boolean }) public editMode = false;
+  @property({ attribute: "edit-mode", type: Boolean })
+  public editMode = false;
 
   @state() private _notifications?: PersistentNotification[];
 
diff --git a/src/components/ha-target-picker.ts b/src/components/ha-target-picker.ts
index f93148c0c31d..19efb2167de2 100644
--- a/src/components/ha-target-picker.ts
+++ b/src/components/ha-target-picker.ts
@@ -84,7 +84,7 @@ export class HaTargetPicker extends SubscribeMixin(LitElement) {
 
   @property({ type: Boolean, reflect: true }) public disabled = false;
 
-  @property({ attribute: false, type: Boolean }) public addOnTop = false;
+  @property({ attribute: "add-on-top", type: Boolean }) public addOnTop = false;
 
   @state() private _addMode?:
     | "area_id"
diff --git a/src/components/ha-theme-picker.ts b/src/components/ha-theme-picker.ts
index 510d9d188244..ebb8a9a1a863 100644
--- a/src/components/ha-theme-picker.ts
+++ b/src/components/ha-theme-picker.ts
@@ -15,7 +15,8 @@ export class HaThemePicker extends LitElement {
 
   @property() public label?: string;
 
-  @property({ attribute: false, type: Boolean }) includeDefault = false;
+  @property({ attribute: "include-default", type: Boolean })
+  public includeDefault = false;
 
   @property({ attribute: false }) public hass?: HomeAssistant;
 
diff --git a/src/components/ha-two-pane-top-app-bar-fixed.ts b/src/components/ha-two-pane-top-app-bar-fixed.ts
index e42a96c3a36b..50ee9d87661e 100644
--- a/src/components/ha-two-pane-top-app-bar-fixed.ts
+++ b/src/components/ha-two-pane-top-app-bar-fixed.ts
@@ -32,7 +32,7 @@ export class TopAppBarBaseBase extends BaseElement {
 
   protected _scrollTarget!: HTMLElement | Window;
 
-  @property({ attribute: false, type: Boolean }) centerTitle = false;
+  @property({ attribute: "center-title", type: Boolean }) centerTitle = false;
 
   @property({ type: Boolean, reflect: true }) prominent = false;
 
diff --git a/src/components/map/ha-locations-editor.ts b/src/components/map/ha-locations-editor.ts
index 720b9ca666d9..0c46d79ffd55 100644
--- a/src/components/map/ha-locations-editor.ts
+++ b/src/components/map/ha-locations-editor.ts
@@ -51,7 +51,7 @@ export class HaLocationsEditor extends LitElement {
 
   @property() public helper?: string;
 
-  @property({ attribute: false, type: Boolean }) public autoFit = false;
+  @property({ attribute: "auto-fit", type: Boolean }) public autoFit = false;
 
   @property({ type: Number }) public zoom = 16;
 
diff --git a/src/components/map/ha-map.ts b/src/components/map/ha-map.ts
index 1b984590a77d..6f28738845ea 100644
--- a/src/components/map/ha-map.ts
+++ b/src/components/map/ha-map.ts
@@ -77,7 +77,7 @@ export class HaMap extends ReactiveElement {
   @property({ attribute: "interactive-zones", type: Boolean })
   public interactiveZones = false;
 
-  @property({ attribute: false, type: Boolean }) public fitZones = false;
+  @property({ attribute: "fit-zones", type: Boolean }) public fitZones = false;
 
   @property({ attribute: "theme-mode", type: String })
   public themeMode: ThemeMode = "auto";
diff --git a/src/components/trace/ha-timeline.ts b/src/components/trace/ha-timeline.ts
index 4859fba87334..b7ab5b275702 100644
--- a/src/components/trace/ha-timeline.ts
+++ b/src/components/trace/ha-timeline.ts
@@ -14,7 +14,7 @@ export class HaTimeline extends LitElement {
   @property({ attribute: false, reflect: true, type: Boolean }) notEnabled =
     false;
 
-  @property({ attribute: false, type: Boolean }) public lastItem = false;
+  @property({ attribute: "last-item", type: Boolean }) public lastItem = false;
 
   @property({ type: String }) public icon?: string;
 
diff --git a/src/components/trace/hat-trace-timeline.ts b/src/components/trace/hat-trace-timeline.ts
index 6a12ceb1c80c..0552074560be 100644
--- a/src/components/trace/hat-trace-timeline.ts
+++ b/src/components/trace/hat-trace-timeline.ts
@@ -839,7 +839,7 @@ export class HaAutomationTracer extends LitElement {
 
     entries.push(html`
       <ha-timeline
-        lastItem
+        last-item
         .icon=${entry.icon}
         class=${ifDefined(entry.className)}
       >
diff --git a/src/dialogs/more-info/controls/more-info-script.ts b/src/dialogs/more-info/controls/more-info-script.ts
index b1e84c106676..cacaeeca3d68 100644
--- a/src/dialogs/more-info/controls/more-info-script.ts
+++ b/src/dialogs/more-info/controls/more-info-script.ts
@@ -99,8 +99,7 @@ class MoreInfoScript extends LitElement {
                 ${this.hass.localize("ui.card.script.run_script")}
               </div>
               <ha-service-control
-                hidePicker
-                hideDescription
+                hide-description
                 .hass=${this.hass}
                 .value=${this._scriptData}
                 .showAdvanced=${this.hass.userData?.showAdvanced}
diff --git a/src/layouts/hass-tabs-subpage-data-table.ts b/src/layouts/hass-tabs-subpage-data-table.ts
index af90aff98264..aefbb63a2358 100644
--- a/src/layouts/hass-tabs-subpage-data-table.ts
+++ b/src/layouts/hass-tabs-subpage-data-table.ts
@@ -46,7 +46,7 @@ export class HaTabsSubpageDataTable extends LitElement {
 
   @property({ attribute: false }) public localizeFunc?: LocalizeFunc;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
@@ -156,10 +156,11 @@ export class HaTabsSubpageDataTable extends LitElement {
    * Show the filter menu.
    * @type {Boolean}
    */
-  @property({ attribute: "has-filters", type: Boolean }) public hasFilters =
-    false;
+  @property({ attribute: "has-filters", type: Boolean })
+  public hasFilters = false;
 
-  @property({ attribute: false, type: Boolean }) public showFilters = false;
+  @property({ attribute: "show-filters", type: Boolean })
+  public showFilters = false;
 
   @property({ attribute: false }) public initialSorting?: {
     column: string;
diff --git a/src/onboarding/integration-badge.ts b/src/onboarding/integration-badge.ts
index 1ff2ff1f56e9..8e8affcb1b9d 100644
--- a/src/onboarding/integration-badge.ts
+++ b/src/onboarding/integration-badge.ts
@@ -11,8 +11,8 @@ class IntegrationBadge extends LitElement {
   // eslint-disable-next-line lit/no-native-attributes
   @property({ attribute: false }) public title!: string;
 
-  @property({ attribute: false, type: Boolean }) public darkOptimizedIcon =
-    false;
+  @property({ attribute: "dark-optimized-icon", type: Boolean })
+  public darkOptimizedIcon = false;
 
   @property({ attribute: false, type: Boolean, reflect: true })
   public clickable = false;
diff --git a/src/onboarding/onboarding-welcome-links.ts b/src/onboarding/onboarding-welcome-links.ts
index 0682469baf94..33c06b53d99f 100644
--- a/src/onboarding/onboarding-welcome-links.ts
+++ b/src/onboarding/onboarding-welcome-links.ts
@@ -15,7 +15,8 @@ class OnboardingWelcomeLinks extends LitElement {
 
   @property({ attribute: false }) public localize!: LocalizeFunc<any>;
 
-  @property({ attribute: false, type: Boolean }) public mobileApp = false;
+  @property({ attribute: "mobile-app", type: Boolean })
+  public mobileApp = false;
 
   protected render(): TemplateResult {
     return html`<a
diff --git a/src/panels/calendar/ha-recurrence-rule-editor.ts b/src/panels/calendar/ha-recurrence-rule-editor.ts
index 5275b3a1d4ab..20868b35cb25 100644
--- a/src/panels/calendar/ha-recurrence-rule-editor.ts
+++ b/src/panels/calendar/ha-recurrence-rule-editor.ts
@@ -44,7 +44,7 @@ export class RecurrenceRuleEditor extends LitElement {
 
   @property({ attribute: false }) public dtstart?: Date;
 
-  @property({ attribute: false, type: Boolean }) public allDay = false;
+  @property({ attribute: "all-day", type: Boolean }) public allDay = false;
 
   @property({ attribute: false }) public locale!: HomeAssistant["locale"];
 
diff --git a/src/panels/config/application_credentials/ha-config-application-credentials.ts b/src/panels/config/application_credentials/ha-config-application-credentials.ts
index 5d188627404e..c790bb67ffd7 100644
--- a/src/panels/config/application_credentials/ha-config-application-credentials.ts
+++ b/src/panels/config/application_credentials/ha-config-application-credentials.ts
@@ -37,7 +37,7 @@ export class HaConfigApplicationCredentials extends LitElement {
 
   @state() public _applicationCredentials: ApplicationCredential[] = [];
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/areas/ha-config-area-page.ts b/src/panels/config/areas/ha-config-area-page.ts
index 10f313aa4a7a..1ace9c994006 100644
--- a/src/panels/config/areas/ha-config-area-page.ts
+++ b/src/panels/config/areas/ha-config-area-page.ts
@@ -66,9 +66,9 @@ class HaConfigAreaPage extends LitElement {
 
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @state()
   @consume({ context: fullEntitiesContext, subscribe: true })
diff --git a/src/panels/config/areas/ha-config-areas-dashboard.ts b/src/panels/config/areas/ha-config-areas-dashboard.ts
index 424a75fa3f2c..b86009a61000 100644
--- a/src/panels/config/areas/ha-config-areas-dashboard.ts
+++ b/src/panels/config/areas/ha-config-areas-dashboard.ts
@@ -58,7 +58,7 @@ const SORT_OPTIONS = { sort: false, delay: 500, delayOnTouchOnly: true };
 export class HaConfigAreasDashboard extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/areas/ha-config-areas.ts b/src/panels/config/areas/ha-config-areas.ts
index 7a79fb5524a7..480d2f09a9a6 100644
--- a/src/panels/config/areas/ha-config-areas.ts
+++ b/src/panels/config/areas/ha-config-areas.ts
@@ -11,9 +11,9 @@ class HaConfigAreas extends HassRouterPage {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   protected routerOptions: RouterOptions = {
     defaultPage: "dashboard",
diff --git a/src/panels/config/automation/add-automation-element-dialog.ts b/src/panels/config/automation/add-automation-element-dialog.ts
index c5d298e44db8..6496a5da63f0 100644
--- a/src/panels/config/automation/add-automation-element-dialog.ts
+++ b/src/panels/config/automation/add-automation-element-dialog.ts
@@ -318,7 +318,7 @@ class DialogAddAutomationElement extends LitElement implements HassDialog {
             <ha-domain-icon
               .hass=${this.hass}
               .domain=${domain}
-              brandFallback
+              brand-fallback
             ></ha-domain-icon>
           `,
           key: `${SERVICE_PREFIX}${domain}`,
diff --git a/src/panels/config/automation/condition/ha-automation-condition-editor.ts b/src/panels/config/automation/condition/ha-automation-condition-editor.ts
index 06dfc7099c41..5b7bfe51e2a4 100644
--- a/src/panels/config/automation/condition/ha-automation-condition-editor.ts
+++ b/src/panels/config/automation/condition/ha-automation-condition-editor.ts
@@ -28,7 +28,7 @@ export default class HaAutomationConditionEditor extends LitElement {
 
   @property({ type: Boolean }) public disabled = false;
 
-  @property({ attribute: false, type: Boolean }) public yamlMode = false;
+  @property({ attribute: false }) public yamlMode = false;
 
   private _processedCondition = memoizeOne((condition) =>
     expandConditionWithShorthand(condition)
diff --git a/src/panels/config/automation/ha-automation-editor.ts b/src/panels/config/automation/ha-automation-editor.ts
index 6f1b4c662ef6..aff655f7b553 100644
--- a/src/panels/config/automation/ha-automation-editor.ts
+++ b/src/panels/config/automation/ha-automation-editor.ts
@@ -91,7 +91,7 @@ export class HaAutomationEditor extends KeyboardShortcutMixin(LitElement) {
 
   @property({ attribute: false }) public automations!: AutomationEntity[];
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/automation/ha-automation-picker.ts b/src/panels/config/automation/ha-automation-picker.ts
index cbcc207630e0..87d276890346 100644
--- a/src/panels/config/automation/ha-automation-picker.ts
+++ b/src/panels/config/automation/ha-automation-picker.ts
@@ -128,7 +128,7 @@ type AutomationItem = AutomationEntity & {
 class HaAutomationPicker extends SubscribeMixin(LitElement) {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/automation/ha-automation-trace.ts b/src/panels/config/automation/ha-automation-trace.ts
index 1cf4acdd5c42..536cdbbf459c 100644
--- a/src/panels/config/automation/ha-automation-trace.ts
+++ b/src/panels/config/automation/ha-automation-trace.ts
@@ -53,7 +53,7 @@ export class HaAutomationTrace extends LitElement {
 
   @property({ attribute: false }) public automations!: AutomationEntity[];
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
diff --git a/src/panels/config/automation/ha-config-automation.ts b/src/panels/config/automation/ha-config-automation.ts
index ae8e5c5c76f4..af11d0405cea 100644
--- a/src/panels/config/automation/ha-config-automation.ts
+++ b/src/panels/config/automation/ha-config-automation.ts
@@ -24,9 +24,9 @@ class HaConfigAutomation extends HassRouterPage {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @property({ attribute: false }) public automations: AutomationEntity[] = [];
 
diff --git a/src/panels/config/automation/manual-automation-editor.ts b/src/panels/config/automation/manual-automation-editor.ts
index 3455fad61561..7799de380919 100644
--- a/src/panels/config/automation/manual-automation-editor.ts
+++ b/src/panels/config/automation/manual-automation-editor.ts
@@ -34,7 +34,7 @@ import { constructUrlCurrentPath } from "../../../common/url/construct-url";
 export class HaManualAutomationEditor extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/backup/ha-config-backup.ts b/src/panels/config/backup/ha-config-backup.ts
index eb9a81322a27..0c3b4bf0410a 100644
--- a/src/panels/config/backup/ha-config-backup.ts
+++ b/src/panels/config/backup/ha-config-backup.ts
@@ -33,7 +33,7 @@ import { fileDownload } from "../../../util/file_download";
 class HaConfigBackup extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/blueprint/blueprint-generic-editor.ts b/src/panels/config/blueprint/blueprint-generic-editor.ts
index a7cda69b9534..2c94a46be24a 100644
--- a/src/panels/config/blueprint/blueprint-generic-editor.ts
+++ b/src/panels/config/blueprint/blueprint-generic-editor.ts
@@ -24,7 +24,7 @@ import type { HomeAssistant } from "../../../types";
 export abstract class HaBlueprintGenericEditor extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public disabled = false;
 
diff --git a/src/panels/config/blueprint/ha-blueprint-overview.ts b/src/panels/config/blueprint/ha-blueprint-overview.ts
index 294edb981401..e44b4a571d5b 100644
--- a/src/panels/config/blueprint/ha-blueprint-overview.ts
+++ b/src/panels/config/blueprint/ha-blueprint-overview.ts
@@ -81,7 +81,7 @@ const createNewFunctions = {
 class HaBlueprintOverview extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/blueprint/ha-config-blueprint.ts b/src/panels/config/blueprint/ha-config-blueprint.ts
index ec7e5c7518c2..521e1fd9d5fe 100644
--- a/src/panels/config/blueprint/ha-config-blueprint.ts
+++ b/src/panels/config/blueprint/ha-config-blueprint.ts
@@ -20,9 +20,9 @@ class HaConfigBlueprint extends HassRouterPage {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @property({ attribute: false })
   public blueprints: Record<string, Blueprints> = {};
diff --git a/src/panels/config/cloud/account/cloud-account.ts b/src/panels/config/cloud/account/cloud-account.ts
index 72ca38d002fb..5ccbe1ef604b 100644
--- a/src/panels/config/cloud/account/cloud-account.ts
+++ b/src/panels/config/cloud/account/cloud-account.ts
@@ -37,7 +37,7 @@ import "./cloud-webhooks";
 export class CloudAccount extends SubscribeMixin(LitElement) {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/cloud/ha-config-cloud.ts b/src/panels/config/cloud/ha-config-cloud.ts
index 2a0bfacd210e..780975332c88 100644
--- a/src/panels/config/cloud/ha-config-cloud.ts
+++ b/src/panels/config/cloud/ha-config-cloud.ts
@@ -14,7 +14,7 @@ const NOT_LOGGED_IN_URLS = ["login", "register", "forgot-password"];
 class HaConfigCloud extends HassRouterPage {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/cloud/login/cloud-login.ts b/src/panels/config/cloud/login/cloud-login.ts
index b12f1fd87e62..2190b8a388a9 100644
--- a/src/panels/config/cloud/login/cloud-login.ts
+++ b/src/panels/config/cloud/login/cloud-login.ts
@@ -31,7 +31,7 @@ import "../../ha-config-section";
 export class CloudLogin extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/cloud/register/cloud-register.ts b/src/panels/config/cloud/register/cloud-register.ts
index 789d549b443d..98606a936981 100644
--- a/src/panels/config/cloud/register/cloud-register.ts
+++ b/src/panels/config/cloud/register/cloud-register.ts
@@ -18,7 +18,7 @@ import "../../../../components/ha-password-field";
 export class CloudRegister extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/core/ha-config-system-navigation.ts b/src/panels/config/core/ha-config-system-navigation.ts
index d15a0f35b9bf..3f6675e5b1af 100644
--- a/src/panels/config/core/ha-config-system-navigation.ts
+++ b/src/panels/config/core/ha-config-system-navigation.ts
@@ -38,11 +38,11 @@ class HaConfigSystemNavigation extends LitElement {
 
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public cloudStatus?: CloudStatus;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @state() private _latestBackupDate?: string;
 
diff --git a/src/panels/config/dashboard/ha-config-dashboard.ts b/src/panels/config/dashboard/ha-config-dashboard.ts
index 5f5f0ca1c81d..281d3670a926 100644
--- a/src/panels/config/dashboard/ha-config-dashboard.ts
+++ b/src/panels/config/dashboard/ha-config-dashboard.ts
@@ -127,11 +127,11 @@ class HaConfigDashboard extends SubscribeMixin(LitElement) {
 
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public cloudStatus?: CloudStatus;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @state() private _tip?: string;
 
diff --git a/src/panels/config/devices/device-detail/ha-device-entities-card.ts b/src/panels/config/devices/device-detail/ha-device-entities-card.ts
index d57423be7377..8d5cb7e924e6 100644
--- a/src/panels/config/devices/device-detail/ha-device-entities-card.ts
+++ b/src/panels/config/devices/device-detail/ha-device-entities-card.ts
@@ -37,7 +37,8 @@ export class HaDeviceEntitiesCard extends LitElement {
 
   @property({ attribute: false }) public entities!: EntityRegistryStateEntry[];
 
-  @property({ attribute: false, type: Boolean }) public showHidden = false;
+  @property({ attribute: "show-hidden", type: Boolean })
+  public showHidden = false;
 
   @state() private _extDisabledEntityEntries?: Record<
     string,
diff --git a/src/panels/config/devices/device-detail/integration-elements/mqtt/mqtt-discovery-payload.ts b/src/panels/config/devices/device-detail/integration-elements/mqtt/mqtt-discovery-payload.ts
index 5f8992eb43c2..63c8a9a9ab0f 100644
--- a/src/panels/config/devices/device-detail/integration-elements/mqtt/mqtt-discovery-payload.ts
+++ b/src/panels/config/devices/device-detail/integration-elements/mqtt/mqtt-discovery-payload.ts
@@ -8,7 +8,8 @@ import { classMap } from "lit/directives/class-map";
 class MQTTDiscoveryPayload extends LitElement {
   @property({ attribute: false }) public payload!: Record<string, unknown>;
 
-  @property({ attribute: false, type: Boolean }) public showAsYaml = false;
+  @property({ attribute: "show-as-yaml", type: Boolean })
+  public showAsYaml = false;
 
   @property() public summary!: string;
 
diff --git a/src/panels/config/devices/device-detail/integration-elements/mqtt/mqtt-messages.ts b/src/panels/config/devices/device-detail/integration-elements/mqtt/mqtt-messages.ts
index e7a9d7fed502..4e6801b1b7b2 100644
--- a/src/panels/config/devices/device-detail/integration-elements/mqtt/mqtt-messages.ts
+++ b/src/panels/config/devices/device-detail/integration-elements/mqtt/mqtt-messages.ts
@@ -15,10 +15,11 @@ class MQTTMessages extends LitElement {
 
   @property() public direction!: string;
 
-  @property({ attribute: false, type: Boolean }) public showAsYaml = false;
+  @property({ attribute: "show-as-yaml", type: Boolean })
+  public showAsYaml = false;
 
-  @property({ attribute: false, type: Boolean }) public showDeserialized =
-    false;
+  @property({ attribute: "show-deserialized", type: Boolean })
+  public showDeserialized = false;
 
   @property({ attribute: false }) public subscribedTopic!: string;
 
diff --git a/src/panels/config/devices/ha-config-device-page.ts b/src/panels/config/devices/ha-config-device-page.ts
index bc383bb7a754..f8961773ab4a 100644
--- a/src/panels/config/devices/ha-config-device-page.ts
+++ b/src/panels/config/devices/ha-config-device-page.ts
@@ -117,9 +117,9 @@ export class HaConfigDevicePage extends LitElement {
 
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @state() private _related?: RelatedResult;
 
diff --git a/src/panels/config/devices/ha-config-devices-dashboard.ts b/src/panels/config/devices/ha-config-devices-dashboard.ts
index f775364070d9..71e2a5e61033 100644
--- a/src/panels/config/devices/ha-config-devices-dashboard.ts
+++ b/src/panels/config/devices/ha-config-devices-dashboard.ts
@@ -104,7 +104,7 @@ export class HaConfigDeviceDashboard extends SubscribeMixin(LitElement) {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public entries!: ConfigEntry[];
 
diff --git a/src/panels/config/devices/ha-config-devices.ts b/src/panels/config/devices/ha-config-devices.ts
index 815540ee4122..9532d2ba4865 100644
--- a/src/panels/config/devices/ha-config-devices.ts
+++ b/src/panels/config/devices/ha-config-devices.ts
@@ -15,9 +15,9 @@ class HaConfigDevices extends HassRouterPage {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   protected routerOptions: RouterOptions = {
     defaultPage: "dashboard",
diff --git a/src/panels/config/energy/ha-config-energy.ts b/src/panels/config/energy/ha-config-energy.ts
index a870e1fef9b8..c808dd82f2f0 100644
--- a/src/panels/config/energy/ha-config-energy.ts
+++ b/src/panels/config/energy/ha-config-energy.ts
@@ -38,9 +38,9 @@ class HaConfigEnergy extends LitElement {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @property({ attribute: false }) public route!: Route;
 
diff --git a/src/panels/config/entities/ha-config-entities.ts b/src/panels/config/entities/ha-config-entities.ts
index b6cab5ce8689..937dcfa30999 100644
--- a/src/panels/config/entities/ha-config-entities.ts
+++ b/src/panels/config/entities/ha-config-entities.ts
@@ -136,7 +136,7 @@ export interface EntityRow extends StateEntity {
 export class HaConfigEntities extends SubscribeMixin(LitElement) {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/ha-config-section.ts b/src/panels/config/ha-config-section.ts
index 494a91543b04..f4c170ae6b0f 100644
--- a/src/panels/config/ha-config-section.ts
+++ b/src/panels/config/ha-config-section.ts
@@ -4,7 +4,7 @@ import { classMap } from "lit/directives/class-map";
 
 @customElement("ha-config-section")
 export class HaConfigSection extends LitElement {
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public vertical = false;
 
diff --git a/src/panels/config/hardware/ha-config-hardware.ts b/src/panels/config/hardware/ha-config-hardware.ts
index 7d88ceb1716f..1d278c32ba31 100644
--- a/src/panels/config/hardware/ha-config-hardware.ts
+++ b/src/panels/config/hardware/ha-config-hardware.ts
@@ -301,7 +301,7 @@ class HaConfigHardware extends SubscribeMixin(LitElement) {
                         <mwc-list>
                           <ha-clickable-list-item
                             .href=${documentationURL}
-                            openNewTab
+                            open-new-tab
                             twoline
                             hasMeta
                           >
diff --git a/src/panels/config/helpers/ha-config-helpers.ts b/src/panels/config/helpers/ha-config-helpers.ts
index f8328902761c..3f8ffc70e39f 100644
--- a/src/panels/config/helpers/ha-config-helpers.ts
+++ b/src/panels/config/helpers/ha-config-helpers.ts
@@ -148,7 +148,7 @@ const getConfigEntry = (
 export class HaConfigHelpers extends SubscribeMixin(LitElement) {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/info/ha-config-info.ts b/src/panels/config/info/ha-config-info.ts
index d235a2229402..688ccb6f893b 100644
--- a/src/panels/config/info/ha-config-info.ts
+++ b/src/panels/config/info/ha-config-info.ts
@@ -83,9 +83,9 @@ class HaConfigInfo extends LitElement {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @property({ attribute: false }) public route!: Route;
 
@@ -172,7 +172,7 @@ class HaConfigInfo extends LitElement {
                 (page) => html`
                   <ha-clickable-list-item
                     graphic="avatar"
-                    openNewTab
+                    open-new-tab
                     href=${documentationUrl(this.hass, page.path)}
                   >
                     <div
diff --git a/src/panels/config/integrations/ha-config-integration-page.ts b/src/panels/config/integrations/ha-config-integration-page.ts
index 40f72e32b426..54af33cf7b65 100644
--- a/src/panels/config/integrations/ha-config-integration-page.ts
+++ b/src/panels/config/integrations/ha-config-integration-page.ts
@@ -147,9 +147,9 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
 
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @property({ attribute: false }) public configEntries?: ConfigEntry[];
 
diff --git a/src/panels/config/integrations/ha-config-integrations-dashboard.ts b/src/panels/config/integrations/ha-config-integrations-dashboard.ts
index 7da1540ef881..3b7c36db92ec 100644
--- a/src/panels/config/integrations/ha-config-integrations-dashboard.ts
+++ b/src/panels/config/integrations/ha-config-integrations-dashboard.ts
@@ -95,9 +95,9 @@ class HaConfigIntegrationsDashboard extends SubscribeMixin(LitElement) {
 
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @property({ attribute: false }) public route!: Route;
 
diff --git a/src/panels/config/integrations/ha-config-integrations.ts b/src/panels/config/integrations/ha-config-integrations.ts
index 7d2540f44b63..b8268cfcc425 100644
--- a/src/panels/config/integrations/ha-config-integrations.ts
+++ b/src/panels/config/integrations/ha-config-integrations.ts
@@ -49,9 +49,9 @@ class HaConfigIntegrations extends SubscribeMixin(HassRouterPage) {
 
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   protected routerOptions: RouterOptions = {
     defaultPage: "dashboard",
diff --git a/src/panels/config/integrations/ha-integration-card.ts b/src/panels/config/integrations/ha-integration-card.ts
index 3f24c7202f09..0187a9469005 100644
--- a/src/panels/config/integrations/ha-integration-card.ts
+++ b/src/panels/config/integrations/ha-integration-card.ts
@@ -38,7 +38,7 @@ export class HaIntegrationCard extends LitElement {
   @property({ attribute: false })
   public entityRegistryEntries!: EntityRegistryEntry[];
 
-  @property({ attribute: false, type: Boolean })
+  @property({ attribute: "supports-diagnostics", type: Boolean })
   public supportsDiagnostics = false;
 
   @property({ attribute: false }) public logInfo?: IntegrationLogInfo;
diff --git a/src/panels/config/integrations/ha-integration-list-item.ts b/src/panels/config/integrations/ha-integration-list-item.ts
index ae92254043ed..175fb05fab86 100644
--- a/src/panels/config/integrations/ha-integration-list-item.ts
+++ b/src/panels/config/integrations/ha-integration-list-item.ts
@@ -21,7 +21,8 @@ export class HaIntegrationListItem extends ListItemBase {
 
   @property({ type: String, reflect: true }) graphic: GraphicType = "medium";
 
-  @property({ attribute: false, type: Boolean }) hasMeta = true;
+  // eslint-disable-next-line lit/attribute-names
+  @property({ type: Boolean }) hasMeta = true;
 
   @property({ type: Boolean }) brand = false;
 
diff --git a/src/panels/config/integrations/integration-panels/matter/matter-config-panel.ts b/src/panels/config/integrations/integration-panels/matter/matter-config-panel.ts
index 0fb4962a5cd0..14ec0bf728d2 100644
--- a/src/panels/config/integrations/integration-panels/matter/matter-config-panel.ts
+++ b/src/panels/config/integrations/integration-panels/matter/matter-config-panel.ts
@@ -22,7 +22,7 @@ export const configTabs: PageNavigation[] = [
 class MatterConfigRouter extends HassRouterPage {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/integrations/integration-panels/zha/zha-add-devices-page.ts b/src/panels/config/integrations/integration-panels/zha/zha-add-devices-page.ts
index d3302dc3fe46..4bd0ad984619 100644
--- a/src/panels/config/integrations/integration-panels/zha/zha-add-devices-page.ts
+++ b/src/panels/config/integrations/integration-panels/zha/zha-add-devices-page.ts
@@ -19,7 +19,7 @@ class ZHAAddDevicesPage extends LitElement {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public route?: Route;
 
diff --git a/src/panels/config/integrations/integration-panels/zha/zha-cluster-commands.ts b/src/panels/config/integrations/integration-panels/zha/zha-cluster-commands.ts
index acef31c196ab..832f28a10c18 100644
--- a/src/panels/config/integrations/integration-panels/zha/zha-cluster-commands.ts
+++ b/src/panels/config/integrations/integration-panels/zha/zha-cluster-commands.ts
@@ -18,7 +18,7 @@ import type { IssueCommandServiceData } from "./types";
 export class ZHAClusterCommands extends LitElement {
   @property({ attribute: false }) public hass?: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public device?: ZHADevice;
 
diff --git a/src/panels/config/integrations/integration-panels/zha/zha-config-dashboard-router.ts b/src/panels/config/integrations/integration-panels/zha/zha-config-dashboard-router.ts
index fa5a520dd4ea..9b5a54818b33 100644
--- a/src/panels/config/integrations/integration-panels/zha/zha-config-dashboard-router.ts
+++ b/src/panels/config/integrations/integration-panels/zha/zha-config-dashboard-router.ts
@@ -8,7 +8,7 @@ import type { HomeAssistant } from "../../../../../types";
 class ZHAConfigDashboardRouter extends HassRouterPage {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/integrations/integration-panels/zha/zha-config-dashboard.ts b/src/panels/config/integrations/integration-panels/zha/zha-config-dashboard.ts
index 6ef52a87acd8..0963a19b99e0 100644
--- a/src/panels/config/integrations/integration-panels/zha/zha-config-dashboard.ts
+++ b/src/panels/config/integrations/integration-panels/zha/zha-config-dashboard.ts
@@ -67,7 +67,7 @@ class ZHAConfigDashboard extends LitElement {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public configEntryId?: string;
 
diff --git a/src/panels/config/integrations/integration-panels/zha/zha-group-page.ts b/src/panels/config/integrations/integration-panels/zha/zha-group-page.ts
index 4b0f22450feb..c10f453ebde0 100644
--- a/src/panels/config/integrations/integration-panels/zha/zha-group-page.ts
+++ b/src/panels/config/integrations/integration-panels/zha/zha-group-page.ts
@@ -37,7 +37,7 @@ export class ZHAGroupPage extends LitElement {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false, type: Array })
   public deviceEndpoints: ZHADeviceEndpoint[] = [];
diff --git a/src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts b/src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts
index 5f6352d932f5..bc4b9efa5938 100644
--- a/src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts
+++ b/src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts
@@ -34,7 +34,7 @@ export class ZHAGroupsDashboard extends LitElement {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @state() private _groups: ZHAGroup[] = [];
 
diff --git a/src/panels/config/integrations/integration-panels/zha/zha-manage-clusters.ts b/src/panels/config/integrations/integration-panels/zha/zha-manage-clusters.ts
index a7fa75e1ce6a..cf60f26d99ca 100644
--- a/src/panels/config/integrations/integration-panels/zha/zha-manage-clusters.ts
+++ b/src/panels/config/integrations/integration-panels/zha/zha-manage-clusters.ts
@@ -31,7 +31,7 @@ const tabs = ["attributes", "commands"] as const;
 export class ZHAManageClusters extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public device?: ZHADevice;
 
diff --git a/src/panels/config/integrations/integration-panels/zha/zha-network-visualization-page.ts b/src/panels/config/integrations/integration-panels/zha/zha-network-visualization-page.ts
index 3250bd1398b8..ac32a166ae30 100644
--- a/src/panels/config/integrations/integration-panels/zha/zha-network-visualization-page.ts
+++ b/src/panels/config/integrations/integration-panels/zha/zha-network-visualization-page.ts
@@ -31,7 +31,7 @@ export class ZHANetworkVisualizationPage extends LitElement {
 
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false })
   public zoomedDeviceIdFromURL?: string;
diff --git a/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-config-dashboard.ts b/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-config-dashboard.ts
index 0ecf4ba74ad0..77bb839d5a67 100644
--- a/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-config-dashboard.ts
+++ b/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-config-dashboard.ts
@@ -57,7 +57,7 @@ class ZWaveJSConfigDashboard extends SubscribeMixin(LitElement) {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public configEntryId!: string;
 
diff --git a/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-config-router.ts b/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-config-router.ts
index 5e8577f54111..28e1110e46c3 100644
--- a/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-config-router.ts
+++ b/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-config-router.ts
@@ -24,7 +24,7 @@ export const configTabs: PageNavigation[] = [
 class ZWaveJSConfigRouter extends HassRouterPage {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-node-config.ts b/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-node-config.ts
index 8916ae030109..3ee719f3df0e 100644
--- a/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-node-config.ts
+++ b/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-node-config.ts
@@ -60,7 +60,7 @@ class ZWaveJSNodeConfig extends LitElement {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public configEntryId?: string;
 
diff --git a/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-node-installer.ts b/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-node-installer.ts
index 72936adc9f79..7664a4811bb7 100644
--- a/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-node-installer.ts
+++ b/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-node-installer.ts
@@ -40,7 +40,7 @@ class ZWaveJSNodeInstaller extends LitElement {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public configEntryId?: string;
 
diff --git a/src/panels/config/labels/ha-config-labels.ts b/src/panels/config/labels/ha-config-labels.ts
index 48cb1307563a..b97cb8c5bdc4 100644
--- a/src/panels/config/labels/ha-config-labels.ts
+++ b/src/panels/config/labels/ha-config-labels.ts
@@ -47,7 +47,7 @@ import { showLabelDetailDialog } from "./show-dialog-label-detail";
 export class HaConfigLabels extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/logs/ha-config-logs.ts b/src/panels/config/logs/ha-config-logs.ts
index a173fd9f4477..9443be0f0650 100644
--- a/src/panels/config/logs/ha-config-logs.ts
+++ b/src/panels/config/logs/ha-config-logs.ts
@@ -51,7 +51,7 @@ export class HaConfigLogs extends LitElement {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public route!: Route;
 
diff --git a/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts b/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts
index 5023dd41e8ff..4169145d116e 100644
--- a/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts
+++ b/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts
@@ -65,7 +65,7 @@ type DataTableItem = Pick<
 export class HaConfigLovelaceDashboards extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/lovelace/ha-config-lovelace.ts b/src/panels/config/lovelace/ha-config-lovelace.ts
index 4c5bb1cc502e..d5da7ea44d96 100644
--- a/src/panels/config/lovelace/ha-config-lovelace.ts
+++ b/src/panels/config/lovelace/ha-config-lovelace.ts
@@ -26,7 +26,7 @@ class HaConfigLovelace extends HassRouterPage {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   protected routerOptions: RouterOptions = {
     defaultPage: "dashboards",
diff --git a/src/panels/config/lovelace/resources/ha-config-lovelace-resources.ts b/src/panels/config/lovelace/resources/ha-config-lovelace-resources.ts
index 250f7e92eb38..faac1ab6db9e 100644
--- a/src/panels/config/lovelace/resources/ha-config-lovelace-resources.ts
+++ b/src/panels/config/lovelace/resources/ha-config-lovelace-resources.ts
@@ -38,7 +38,7 @@ import { storage } from "../../../../common/decorators/storage";
 export class HaConfigLovelaceRescources extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/person/ha-config-person.ts b/src/panels/config/person/ha-config-person.ts
index dac3d595c68a..04c87b1c21cb 100644
--- a/src/panels/config/person/ha-config-person.ts
+++ b/src/panels/config/person/ha-config-person.ts
@@ -37,7 +37,7 @@ import {
 export class HaConfigPerson extends LitElement {
   @property({ attribute: false }) public hass?: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/repairs/integrations-startup-time.ts b/src/panels/config/repairs/integrations-startup-time.ts
index a065b182411c..3927e353708f 100644
--- a/src/panels/config/repairs/integrations-startup-time.ts
+++ b/src/panels/config/repairs/integrations-startup-time.ts
@@ -56,7 +56,7 @@ class IntegrationsStartupTime extends LitElement {
               graphic="avatar"
               twoline
               hasMeta
-              openNewTab
+              open-new-tab
               href=${docLink}
             >
               <img
diff --git a/src/panels/config/scene/ha-config-scene.ts b/src/panels/config/scene/ha-config-scene.ts
index c0d0fdfbdece..47e888e0f3fe 100644
--- a/src/panels/config/scene/ha-config-scene.ts
+++ b/src/panels/config/scene/ha-config-scene.ts
@@ -24,9 +24,9 @@ class HaConfigScene extends HassRouterPage {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @property({ attribute: false }) public scenes: SceneEntity[] = [];
 
diff --git a/src/panels/config/scene/ha-scene-dashboard.ts b/src/panels/config/scene/ha-scene-dashboard.ts
index 473a1d9dd64d..de76e4be134c 100644
--- a/src/panels/config/scene/ha-scene-dashboard.ts
+++ b/src/panels/config/scene/ha-scene-dashboard.ts
@@ -118,7 +118,7 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public route!: Route;
 
diff --git a/src/panels/config/scene/ha-scene-editor.ts b/src/panels/config/scene/ha-scene-editor.ts
index 45d822ea1a1e..96b11045503b 100644
--- a/src/panels/config/scene/ha-scene-editor.ts
+++ b/src/panels/config/scene/ha-scene-editor.ts
@@ -96,7 +96,7 @@ export class HaSceneEditor extends SubscribeMixin(
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ attribute: false }) public route!: Route;
 
@@ -104,7 +104,7 @@ export class HaSceneEditor extends SubscribeMixin(
 
   @property({ attribute: false }) public scenes!: SceneEntity[];
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @state() private _dirty = false;
 
diff --git a/src/panels/config/script/ha-config-script.ts b/src/panels/config/script/ha-config-script.ts
index 91f54a93518a..9bbd0e3a0878 100644
--- a/src/panels/config/script/ha-config-script.ts
+++ b/src/panels/config/script/ha-config-script.ts
@@ -27,9 +27,9 @@ class HaConfigScript extends HassRouterPage {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @property({ attribute: false }) public scripts: ScriptEntity[] = [];
 
diff --git a/src/panels/config/script/ha-script-editor.ts b/src/panels/config/script/ha-script-editor.ts
index 418607183518..6075367a3fa6 100644
--- a/src/panels/config/script/ha-script-editor.ts
+++ b/src/panels/config/script/ha-script-editor.ts
@@ -67,7 +67,7 @@ export class HaScriptEditor extends KeyboardShortcutMixin(LitElement) {
 
   @property({ attribute: false }) public entityRegistry!: EntityRegistryEntry[];
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/script/ha-script-picker.ts b/src/panels/config/script/ha-script-picker.ts
index 342b3fa88b89..9bfbed2fa84d 100644
--- a/src/panels/config/script/ha-script-picker.ts
+++ b/src/panels/config/script/ha-script-picker.ts
@@ -120,7 +120,7 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
 
   @property({ attribute: false }) public scripts!: ScriptEntity[];
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/script/ha-script-trace.ts b/src/panels/config/script/ha-script-trace.ts
index 8d3ded157582..1551c0fe3c72 100644
--- a/src/panels/config/script/ha-script-trace.ts
+++ b/src/panels/config/script/ha-script-trace.ts
@@ -48,7 +48,7 @@ export class HaScriptTrace extends LitElement {
 
   @property({ attribute: false }) public scripts!: ScriptEntity[];
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
diff --git a/src/panels/config/script/manual-script-editor.ts b/src/panels/config/script/manual-script-editor.ts
index 98f29d366855..8ef9cc66d9c5 100644
--- a/src/panels/config/script/manual-script-editor.ts
+++ b/src/panels/config/script/manual-script-editor.ts
@@ -25,7 +25,7 @@ import type HaScriptFields from "./ha-script-fields";
 export class HaManualScriptEditor extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/tags/ha-config-tags.ts b/src/panels/config/tags/ha-config-tags.ts
index cdd8188acc5d..055ca230a5c5 100644
--- a/src/panels/config/tags/ha-config-tags.ts
+++ b/src/panels/config/tags/ha-config-tags.ts
@@ -50,7 +50,7 @@ export interface TagRowData extends Tag {
 export class HaConfigTags extends SubscribeMixin(LitElement) {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/users/ha-config-users.ts b/src/panels/config/users/ha-config-users.ts
index ea5ae6e3ca17..111563c13825 100644
--- a/src/panels/config/users/ha-config-users.ts
+++ b/src/panels/config/users/ha-config-users.ts
@@ -33,7 +33,7 @@ import { storage } from "../../../common/decorators/storage";
 export class HaConfigUsers extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/voice-assistants/ha-config-voice-assistants-assistants.ts b/src/panels/config/voice-assistants/ha-config-voice-assistants-assistants.ts
index f9a55d05f78e..ff959d78302a 100644
--- a/src/panels/config/voice-assistants/ha-config-voice-assistants-assistants.ts
+++ b/src/panels/config/voice-assistants/ha-config-voice-assistants-assistants.ts
@@ -24,7 +24,7 @@ export class HaConfigVoiceAssistantsAssistants extends LitElement {
     ExposeEntitySettings
   >;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/voice-assistants/ha-config-voice-assistants-expose.ts b/src/panels/config/voice-assistants/ha-config-voice-assistants-expose.ts
index d9fe8ca7758e..4241500ee8b7 100644
--- a/src/panels/config/voice-assistants/ha-config-voice-assistants-expose.ts
+++ b/src/panels/config/voice-assistants/ha-config-voice-assistants-expose.ts
@@ -59,7 +59,7 @@ export class VoiceAssistantsExpose extends LitElement {
 
   @property({ attribute: false }) public cloudStatus?: CloudStatus;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/config/voice-assistants/ha-config-voice-assistants.ts b/src/panels/config/voice-assistants/ha-config-voice-assistants.ts
index 4afde39c1b7f..33f77f2c76be 100644
--- a/src/panels/config/voice-assistants/ha-config-voice-assistants.ts
+++ b/src/panels/config/voice-assistants/ha-config-voice-assistants.ts
@@ -31,7 +31,7 @@ class HaConfigVoiceAssistants extends HassRouterPage {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @state()
   @consume({ context: entitiesContext, subscribe: true })
diff --git a/src/panels/config/zone/ha-config-zone.ts b/src/panels/config/zone/ha-config-zone.ts
index 101eb0f34d64..b59152a4fcbe 100644
--- a/src/panels/config/zone/ha-config-zone.ts
+++ b/src/panels/config/zone/ha-config-zone.ts
@@ -50,7 +50,7 @@ import { showZoneDetailDialog } from "./show-dialog-zone-detail";
 export class HaConfigZone extends SubscribeMixin(LitElement) {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
diff --git a/src/panels/developer-tools/yaml_configuration/developer-yaml-config.ts b/src/panels/developer-tools/yaml_configuration/developer-yaml-config.ts
index 3dfcb4681a47..61fcb1375e55 100644
--- a/src/panels/developer-tools/yaml_configuration/developer-yaml-config.ts
+++ b/src/panels/developer-tools/yaml_configuration/developer-yaml-config.ts
@@ -29,13 +29,13 @@ interface TranslatedReloadableDomain {
 export class DeveloperYamlConfig extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isWide = false;
+  @property({ attribute: "is-wide", type: Boolean }) public isWide = false;
 
   @property({ type: Boolean }) public narrow = false;
 
   @property({ attribute: false }) public route!: Route;
 
-  @property({ attribute: false, type: Boolean }) public showAdvanced = false;
+  @property({ attribute: false }) public showAdvanced = false;
 
   @state() private _validating = false;
 
diff --git a/src/panels/history/ha-panel-history.ts b/src/panels/history/ha-panel-history.ts
index 75eb35e04861..1a735413c33e 100644
--- a/src/panels/history/ha-panel-history.ts
+++ b/src/panels/history/ha-panel-history.ts
@@ -177,14 +177,14 @@ class HaPanelHistory extends LitElement {
               ?disabled=${this._isLoading}
               .startDate=${this._startDate}
               .endDate=${this._endDate}
-              extendedPresets
+              extended-presets
               @change=${this._dateRangeChanged}
             ></ha-date-range-picker>
             <ha-target-picker
               .hass=${this.hass}
               .value=${this._targetPickerValue}
               .disabled=${this._isLoading}
-              addOnTop
+              add-on-top
               @value-changed=${this._targetsChanged}
             ></ha-target-picker>
           </div>
diff --git a/src/panels/logbook/ha-logbook.ts b/src/panels/logbook/ha-logbook.ts
index 7ac37ade1215..02466701821d 100644
--- a/src/panels/logbook/ha-logbook.ts
+++ b/src/panels/logbook/ha-logbook.ts
@@ -65,7 +65,8 @@ export class HaLogbook extends LitElement {
   @property({ type: Boolean, attribute: "relative-time" })
   public relativeTime = false;
 
-  @property({ attribute: false, type: Boolean }) public showMoreLink = true;
+  @property({ attribute: "show-more-link", type: Boolean })
+  public showMoreLink = true;
 
   @state() private _logbookEntries?: LogbookEntry[];
 
diff --git a/src/panels/logbook/ha-panel-logbook.ts b/src/panels/logbook/ha-panel-logbook.ts
index 7d84a69a76b8..34d6da0f342f 100644
--- a/src/panels/logbook/ha-panel-logbook.ts
+++ b/src/panels/logbook/ha-panel-logbook.ts
@@ -99,7 +99,7 @@ export class HaPanelLogbook extends LitElement {
             .hass=${this.hass}
             .entityFilter=${filterLogbookCompatibleEntities}
             .value=${this._targetPickerValue}
-            addOnTop
+            add-on-top
             @value-changed=${this._targetsChanged}
           ></ha-target-picker>
         </div>
diff --git a/src/panels/lovelace/cards/energy/hui-energy-devices-detail-graph-card.ts b/src/panels/lovelace/cards/energy/hui-energy-devices-detail-graph-card.ts
index 9e2dfd92b975..bb27c9e0dae7 100644
--- a/src/panels/lovelace/cards/energy/hui-energy-devices-detail-graph-card.ts
+++ b/src/panels/lovelace/cards/energy/hui-energy-devices-detail-graph-card.ts
@@ -130,7 +130,7 @@ export class HuiEnergyDevicesDetailGraphCard
           })}"
         >
           <ha-chart-base
-            externalHidden
+            external-hidden
             .hass=${this.hass}
             .data=${this._chartData}
             .extraData=${this._chartDatasetExtra}
diff --git a/src/panels/lovelace/components/hui-badge-edit-mode.ts b/src/panels/lovelace/components/hui-badge-edit-mode.ts
index f35c09b3b961..fe21913b563f 100644
--- a/src/panels/lovelace/components/hui-badge-edit-mode.ts
+++ b/src/panels/lovelace/components/hui-badge-edit-mode.ts
@@ -39,7 +39,8 @@ export class HuiBadgeEditMode extends LitElement {
 
   @property({ type: Array }) public path!: LovelaceCardPath;
 
-  @property({ attribute: false, type: Boolean }) public hiddenOverlay = false;
+  @property({ attribute: "hidden-overlay", type: Boolean })
+  public hiddenOverlay = false;
 
   @state()
   public _menuOpened: boolean = false;
diff --git a/src/panels/lovelace/components/hui-card-options.ts b/src/panels/lovelace/components/hui-card-options.ts
index 471ba420347c..db9f9eff2f65 100644
--- a/src/panels/lovelace/components/hui-card-options.ts
+++ b/src/panels/lovelace/components/hui-card-options.ts
@@ -56,7 +56,8 @@ export class HuiCardOptions extends LitElement {
 
   @queryAssignedNodes() private _assignedNodes?: NodeListOf<LovelaceCard>;
 
-  @property({ attribute: false, type: Boolean }) public hidePosition = false;
+  @property({ attribute: "hide-position", type: Boolean })
+  public hidePosition = false;
 
   @storage({
     key: "dashboardCardClipboard",
diff --git a/src/panels/lovelace/components/hui-energy-period-selector.ts b/src/panels/lovelace/components/hui-energy-period-selector.ts
index 5c8f2ef0b5fe..ccd7253ab780 100644
--- a/src/panels/lovelace/components/hui-energy-period-selector.ts
+++ b/src/panels/lovelace/components/hui-energy-period-selector.ts
@@ -248,7 +248,7 @@ export class HuiEnergyPeriodSelector extends SubscribeMixin(LitElement) {
             .endDate=${this._endDate || new Date()}
             .ranges=${this._ranges}
             @change=${this._dateRangeChanged}
-            .timePicker=${false}
+            time-picker
             minimal
           ></ha-date-range-picker>
         </div>
diff --git a/src/panels/lovelace/components/hui-generic-entity-row.ts b/src/panels/lovelace/components/hui-generic-entity-row.ts
index 449c3bd6e602..40ee38175bb5 100644
--- a/src/panels/lovelace/components/hui-generic-entity-row.ts
+++ b/src/panels/lovelace/components/hui-generic-entity-row.ts
@@ -32,7 +32,8 @@ export class HuiGenericEntityRow extends LitElement {
   // => static determination will not work => the caller has to pass the desired value in.
   // Same applies for custom components that want to override the default behavior.
   // Default behavior is controlled by DOMAINS_INPUT_ROW.
-  @property({ attribute: false, type: Boolean }) public catchInteraction?;
+  @property({ attribute: "catch-interaction", type: Boolean })
+  public catchInteraction?;
 
   protected render() {
     if (!this.hass || !this.config) {
diff --git a/src/panels/lovelace/editor/hui-entities-card-row-editor.ts b/src/panels/lovelace/editor/hui-entities-card-row-editor.ts
index 2555b2aaa786..1fe8292f5f41 100644
--- a/src/panels/lovelace/editor/hui-entities-card-row-editor.ts
+++ b/src/panels/lovelace/editor/hui-entities-card-row-editor.ts
@@ -82,7 +82,7 @@ export class HuiEntitiesCardRowEditor extends LitElement {
                   : html`
                       <ha-entity-picker
                         allow-custom-entity
-                        hideClearIcon
+                        hide-clear-icon
                         .hass=${this.hass}
                         .value=${(entityConf as EntityConfig).entity}
                         .index=${index}
diff --git a/src/panels/lovelace/editor/view-editor/hui-view-editor.ts b/src/panels/lovelace/editor/view-editor/hui-view-editor.ts
index efd1fc914a45..9d12b7d96805 100644
--- a/src/panels/lovelace/editor/view-editor/hui-view-editor.ts
+++ b/src/panels/lovelace/editor/view-editor/hui-view-editor.ts
@@ -31,7 +31,7 @@ declare global {
 export class HuiViewEditor extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isNew = false;
+  @property({ attribute: false }) public isNew = false;
 
   @state() private _config!: LovelaceViewConfig;
 
diff --git a/src/panels/lovelace/elements/hui-state-badge-element.ts b/src/panels/lovelace/elements/hui-state-badge-element.ts
index 6aff5bc93744..e9d67f42803a 100644
--- a/src/panels/lovelace/elements/hui-state-badge-element.ts
+++ b/src/panels/lovelace/elements/hui-state-badge-element.ts
@@ -91,7 +91,7 @@ export class HuiStateBadgeElement
           : this._config.title === null
             ? ""
             : this._config.title}
-        showName
+        show-name
         @action=${this._handleAction}
         .actionHandler=${actionHandler({
           hasHold: hasAction(this._config!.hold_action),
diff --git a/src/panels/lovelace/sections/hui-error-section.ts b/src/panels/lovelace/sections/hui-error-section.ts
index 6b4847438b63..e394c98bbec4 100644
--- a/src/panels/lovelace/sections/hui-error-section.ts
+++ b/src/panels/lovelace/sections/hui-error-section.ts
@@ -32,7 +32,7 @@ export class HuiErrorSection
 {
   public hass?: HomeAssistant;
 
-  @property({ attribute: false, type: Boolean }) public isStrategy = false;
+  @property({ attribute: false }) public isStrategy = false;
 
   @state() private _config?: ErrorSectionConfig;
 
diff --git a/src/panels/lovelace/sections/hui-grid-section.ts b/src/panels/lovelace/sections/hui-grid-section.ts
index efaccd39d251..f50a5dc7b4bf 100644
--- a/src/panels/lovelace/sections/hui-grid-section.ts
+++ b/src/panels/lovelace/sections/hui-grid-section.ts
@@ -1,7 +1,7 @@
 import { mdiPlus } from "@mdi/js";
 import type { CSSResultGroup } from "lit";
 import { LitElement, css, html, nothing } from "lit";
-import { property, state } from "lit/decorators";
+import { customElement, property, state } from "lit/decorators";
 import { classMap } from "lit/directives/class-map";
 import { repeat } from "lit/directives/repeat";
 import { styleMap } from "lit/directives/style-map";
@@ -37,6 +37,7 @@ const IMPORT_MODE_CARD_SORTABLE_OPTIONS: HaSortableOptions = {
   },
 };
 
+@customElement("hui-grid-section")
 export class GridSection extends LitElement implements LovelaceSectionElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
@@ -46,11 +47,12 @@ export class GridSection extends LitElement implements LovelaceSectionElement {
 
   @property({ attribute: false, type: Number }) public viewIndex?: number;
 
-  @property({ attribute: false, type: Boolean }) public isStrategy = false;
+  @property({ attribute: false }) public isStrategy = false;
 
   @property({ attribute: false }) public cards: HuiCard[] = [];
 
-  @property({ attribute: false, type: Boolean }) public importOnly = false;
+  @property({ attribute: "import-only", type: Boolean })
+  public importOnly = false;
 
   @state() _config?: LovelaceSectionConfig;
 
@@ -309,5 +311,3 @@ declare global {
     "hui-grid-section": GridSection;
   }
 }
-
-customElements.define("hui-grid-section", GridSection);
diff --git a/src/panels/lovelace/views/hui-masonry-view.ts b/src/panels/lovelace/views/hui-masonry-view.ts
index 4bd8b7e1e3ad..697a237a90ca 100644
--- a/src/panels/lovelace/views/hui-masonry-view.ts
+++ b/src/panels/lovelace/views/hui-masonry-view.ts
@@ -42,7 +42,7 @@ export class MasonryView extends LitElement implements LovelaceViewElement {
 
   @property({ type: Number }) public index?: number;
 
-  @property({ attribute: false, type: Boolean }) public isStrategy = false;
+  @property({ attribute: false }) public isStrategy = false;
 
   @property({ attribute: false }) public cards: HuiCard[] = [];
 
diff --git a/src/panels/lovelace/views/hui-panel-view.ts b/src/panels/lovelace/views/hui-panel-view.ts
index f832afb06046..bdfdcfc70c8d 100644
--- a/src/panels/lovelace/views/hui-panel-view.ts
+++ b/src/panels/lovelace/views/hui-panel-view.ts
@@ -22,7 +22,7 @@ export class PanelView extends LitElement implements LovelaceViewElement {
 
   @property({ type: Number }) public index?: number;
 
-  @property({ attribute: false, type: Boolean }) public isStrategy = false;
+  @property({ attribute: false }) public isStrategy = false;
 
   @property({ attribute: false }) public cards: HuiCard[] = [];
 
diff --git a/src/panels/lovelace/views/hui-sections-view.ts b/src/panels/lovelace/views/hui-sections-view.ts
index 7b9b3ca217d7..9532489e27e3 100644
--- a/src/panels/lovelace/views/hui-sections-view.ts
+++ b/src/panels/lovelace/views/hui-sections-view.ts
@@ -57,7 +57,7 @@ export class SectionsView extends LitElement implements LovelaceViewElement {
 
   @property({ type: Number }) public index?: number;
 
-  @property({ attribute: false, type: Boolean }) public isStrategy = false;
+  @property({ attribute: false }) public isStrategy = false;
 
   @property({ attribute: false }) public sections: HuiSection[] = [];
 
diff --git a/src/panels/lovelace/views/hui-sidebar-view.ts b/src/panels/lovelace/views/hui-sidebar-view.ts
index 1ba84bd24629..f91ce3b2cc61 100644
--- a/src/panels/lovelace/views/hui-sidebar-view.ts
+++ b/src/panels/lovelace/views/hui-sidebar-view.ts
@@ -20,7 +20,7 @@ export class SideBarView extends LitElement implements LovelaceViewElement {
 
   @property({ type: Number }) public index?: number;
 
-  @property({ attribute: false, type: Boolean }) public isStrategy = false;
+  @property({ attribute: false }) public isStrategy = false;
 
   @property({ attribute: false }) public cards: HuiCard[] = [];
 
diff --git a/src/panels/profile/ha-change-password-card.ts b/src/panels/profile/ha-change-password-card.ts
index 07427e1a3dc5..e92d028118b7 100644
--- a/src/panels/profile/ha-change-password-card.ts
+++ b/src/panels/profile/ha-change-password-card.ts
@@ -71,7 +71,7 @@ class HaChangePasswordCard extends LitElement {
                   @input=${this._newPasswordChanged}
                   @change=${this._newPasswordChanged}
                   required
-                  auto-validate
+                  autoValidate
                 ></ha-password-field>
                 <ha-password-field
                   .label=${this.hass.localize(
@@ -83,7 +83,7 @@ class HaChangePasswordCard extends LitElement {
                   @input=${this._newPasswordConfirmChanged}
                   @change=${this._newPasswordConfirmChanged}
                   required
-                  auto-validate
+                  autoValidate
                 ></ha-password-field>`
             : ""}
         </div>
diff --git a/src/state-summary/state-card-alert.ts b/src/state-summary/state-card-alert.ts
index 653b9f342077..fa8af96f6e3e 100755
--- a/src/state-summary/state-card-alert.ts
+++ b/src/state-summary/state-card-alert.ts
@@ -14,7 +14,7 @@ class StateCardAlert extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render(): TemplateResult {
     return html`
diff --git a/src/state-summary/state-card-button.ts b/src/state-summary/state-card-button.ts
index 33f882fc8ed9..eb9203b7f865 100644
--- a/src/state-summary/state-card-button.ts
+++ b/src/state-summary/state-card-button.ts
@@ -15,7 +15,7 @@ class StateCardButton extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render() {
     const stateObj = this.stateObj;
diff --git a/src/state-summary/state-card-climate.ts b/src/state-summary/state-card-climate.ts
index 8ca20e855581..8c32836566b7 100644
--- a/src/state-summary/state-card-climate.ts
+++ b/src/state-summary/state-card-climate.ts
@@ -13,7 +13,7 @@ class StateCardClimate extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render(): TemplateResult {
     return html`
diff --git a/src/state-summary/state-card-configurator.ts b/src/state-summary/state-card-configurator.ts
index 0e241d461cd3..d5dacddefc0f 100644
--- a/src/state-summary/state-card-configurator.ts
+++ b/src/state-summary/state-card-configurator.ts
@@ -13,7 +13,7 @@ class StateCardConfigurator extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render(): TemplateResult {
     return html`
diff --git a/src/state-summary/state-card-cover.ts b/src/state-summary/state-card-cover.ts
index 3f734057a18b..d83737df0cd6 100644
--- a/src/state-summary/state-card-cover.ts
+++ b/src/state-summary/state-card-cover.ts
@@ -15,7 +15,7 @@ class StateCardCover extends LitElement {
 
   @property({ attribute: false }) public stateObj!: CoverEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render(): TemplateResult {
     return html`
diff --git a/src/state-summary/state-card-display.ts b/src/state-summary/state-card-display.ts
index a84a76ed1514..3928af07421c 100755
--- a/src/state-summary/state-card-display.ts
+++ b/src/state-summary/state-card-display.ts
@@ -17,7 +17,7 @@ class StateCardDisplay extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   // property used only in CSS
   @property({ type: Boolean, reflect: true }) public rtl = false;
diff --git a/src/state-summary/state-card-event.ts b/src/state-summary/state-card-event.ts
index c954cdbffb91..970bb8fe4c7a 100644
--- a/src/state-summary/state-card-event.ts
+++ b/src/state-summary/state-card-event.ts
@@ -13,7 +13,7 @@ class StateCardEvent extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render() {
     return html`
diff --git a/src/state-summary/state-card-humidifier.ts b/src/state-summary/state-card-humidifier.ts
index 96e1b7e31077..e691ce795622 100644
--- a/src/state-summary/state-card-humidifier.ts
+++ b/src/state-summary/state-card-humidifier.ts
@@ -14,7 +14,7 @@ class StateCardHumidifier extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render(): TemplateResult {
     return html`
diff --git a/src/state-summary/state-card-input_button.ts b/src/state-summary/state-card-input_button.ts
index 918dbee744c9..e44c9bf57623 100644
--- a/src/state-summary/state-card-input_button.ts
+++ b/src/state-summary/state-card-input_button.ts
@@ -15,7 +15,7 @@ class StateCardInputButton extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render() {
     const stateObj = this.stateObj;
diff --git a/src/state-summary/state-card-input_number.ts b/src/state-summary/state-card-input_number.ts
index e90cbabc3394..ae3c46348e68 100644
--- a/src/state-summary/state-card-input_number.ts
+++ b/src/state-summary/state-card-input_number.ts
@@ -16,7 +16,7 @@ class StateCardInputNumber extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   private _loaded?: boolean;
 
diff --git a/src/state-summary/state-card-input_text.ts b/src/state-summary/state-card-input_text.ts
index 9d8634c64554..f6f0695d4751 100644
--- a/src/state-summary/state-card-input_text.ts
+++ b/src/state-summary/state-card-input_text.ts
@@ -14,7 +14,7 @@ class StateCardInputText extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   @state() public value: string = "";
 
@@ -30,7 +30,6 @@ class StateCardInputText extends LitElement {
           .minlength=${this.stateObj.attributes.min}
           .maxlength=${this.stateObj.attributes.max}
           .value=${this.value}
-          .auto-validate=${this.stateObj.attributes.pattern}
           .pattern=${this.stateObj.attributes.pattern}
           .type=${this.stateObj.attributes.mode}
           @input=${this._onInput}
diff --git a/src/state-summary/state-card-lawn_mower.ts b/src/state-summary/state-card-lawn_mower.ts
index 7b7c9c840607..1a2c53d11f83 100644
--- a/src/state-summary/state-card-lawn_mower.ts
+++ b/src/state-summary/state-card-lawn_mower.ts
@@ -13,7 +13,7 @@ class StateCardLawnMower extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   public render() {
     const stateObj = this.stateObj;
diff --git a/src/state-summary/state-card-lock.ts b/src/state-summary/state-card-lock.ts
index ffa3e1e983af..3e73be74e5e0 100644
--- a/src/state-summary/state-card-lock.ts
+++ b/src/state-summary/state-card-lock.ts
@@ -15,7 +15,7 @@ class StateCardLock extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render(): TemplateResult {
     const isLocked = this.stateObj.state === "locked";
diff --git a/src/state-summary/state-card-media_player.ts b/src/state-summary/state-card-media_player.ts
index 4e8598ee4810..b5101cf28ae6 100644
--- a/src/state-summary/state-card-media_player.ts
+++ b/src/state-summary/state-card-media_player.ts
@@ -13,7 +13,7 @@ class StateCardMediaPlayer extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render(): TemplateResult {
     const playerObj = new HassMediaPlayerEntity(this.hass, this.stateObj);
diff --git a/src/state-summary/state-card-number.ts b/src/state-summary/state-card-number.ts
index 502a2141f4c3..c72212784699 100644
--- a/src/state-summary/state-card-number.ts
+++ b/src/state-summary/state-card-number.ts
@@ -16,7 +16,7 @@ class StateCardNumber extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   private _loaded?: boolean;
 
diff --git a/src/state-summary/state-card-scene.ts b/src/state-summary/state-card-scene.ts
index 2805d1cb066d..cf42b3e284b9 100644
--- a/src/state-summary/state-card-scene.ts
+++ b/src/state-summary/state-card-scene.ts
@@ -14,7 +14,7 @@ class StateCardScene extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render() {
     return html`
diff --git a/src/state-summary/state-card-script.ts b/src/state-summary/state-card-script.ts
index af7f4ff3685e..ea076024209b 100644
--- a/src/state-summary/state-card-script.ts
+++ b/src/state-summary/state-card-script.ts
@@ -18,7 +18,7 @@ class StateCardScript extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render() {
     const stateObj = this.stateObj as ScriptEntity;
diff --git a/src/state-summary/state-card-timer.ts b/src/state-summary/state-card-timer.ts
index f299cce6ed2b..f83fdeb33f78 100644
--- a/src/state-summary/state-card-timer.ts
+++ b/src/state-summary/state-card-timer.ts
@@ -13,7 +13,7 @@ class StateCardTimer extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render(): TemplateResult {
     return html`
diff --git a/src/state-summary/state-card-toggle.ts b/src/state-summary/state-card-toggle.ts
index cf9253dbc188..dbcd26777a05 100644
--- a/src/state-summary/state-card-toggle.ts
+++ b/src/state-summary/state-card-toggle.ts
@@ -13,7 +13,7 @@ class StateCardToggle extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render(): TemplateResult {
     return html`
diff --git a/src/state-summary/state-card-update.ts b/src/state-summary/state-card-update.ts
index d31d709c9020..baa898d6bb34 100755
--- a/src/state-summary/state-card-update.ts
+++ b/src/state-summary/state-card-update.ts
@@ -13,7 +13,7 @@ export class StateCardUpdate extends LitElement {
 
   @property({ attribute: false }) public stateObj!: UpdateEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render(): TemplateResult {
     return html`
diff --git a/src/state-summary/state-card-vacuum.ts b/src/state-summary/state-card-vacuum.ts
index abf06c08041d..5a856000b334 100644
--- a/src/state-summary/state-card-vacuum.ts
+++ b/src/state-summary/state-card-vacuum.ts
@@ -13,7 +13,7 @@ class StateCardVacuum extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render(): TemplateResult {
     return html`
diff --git a/src/state-summary/state-card-water_heater.ts b/src/state-summary/state-card-water_heater.ts
index 7f84397933d1..2fe2204b6ce5 100644
--- a/src/state-summary/state-card-water_heater.ts
+++ b/src/state-summary/state-card-water_heater.ts
@@ -13,7 +13,7 @@ class StateCardWaterHeater extends LitElement {
 
   @property({ attribute: false }) public stateObj!: HassEntity;
 
-  @property({ attribute: false, type: Boolean }) public inDialog = false;
+  @property({ attribute: "in-dialog", type: Boolean }) public inDialog = false;
 
   protected render(): TemplateResult {
     return html`

From df21900341f8ef714e22352d9cbb794d4981e8e2 Mon Sep 17 00:00:00 2001
From: karwosts <32912880+karwosts@users.noreply.github.com>
Date: Fri, 6 Dec 2024 17:45:25 -0800
Subject: [PATCH 06/12] No script entities in scenes (#23192)

---
 src/data/scene.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/data/scene.ts b/src/data/scene.ts
index ee56c30c2d88..750fdf9135ab 100644
--- a/src/data/scene.ts
+++ b/src/data/scene.ts
@@ -17,6 +17,7 @@ export const SCENE_IGNORED_DOMAINS = [
   "person",
   "scene",
   "schedule",
+  "script",
   "sensor",
   "sun",
   "update",

From 43f31dd45531085d55c716a2be79100bffd138d0 Mon Sep 17 00:00:00 2001
From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com>
Date: Sat, 7 Dec 2024 09:54:27 +0100
Subject: [PATCH 07/12] Update dependency prettier to v3.4.2 (#23195)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
---
 package.json |  2 +-
 yarn.lock    | 10 +++++-----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/package.json b/package.json
index fcc47e201791..18b9fa2eecd3 100644
--- a/package.json
+++ b/package.json
@@ -223,7 +223,7 @@
     "object-hash": "3.0.0",
     "open": "10.1.0",
     "pinst": "3.0.0",
-    "prettier": "3.4.1",
+    "prettier": "3.4.2",
     "rspack-manifest-plugin": "5.0.2",
     "serve-handler": "6.1.6",
     "sinon": "19.0.2",
diff --git a/yarn.lock b/yarn.lock
index ab1a5748bcfe..7d2b8b172d16 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9258,7 +9258,7 @@ __metadata:
     object-hash: "npm:3.0.0"
     open: "npm:10.1.0"
     pinst: "npm:3.0.0"
-    prettier: "npm:3.4.1"
+    prettier: "npm:3.4.2"
     proxy-polyfill: "npm:0.3.2"
     punycode: "npm:2.3.1"
     qr-scanner: "npm:1.4.2"
@@ -12133,12 +12133,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"prettier@npm:3.4.1":
-  version: 3.4.1
-  resolution: "prettier@npm:3.4.1"
+"prettier@npm:3.4.2":
+  version: 3.4.2
+  resolution: "prettier@npm:3.4.2"
   bin:
     prettier: bin/prettier.cjs
-  checksum: 10/1ee4d1b1a9b6761cbb847cd81b9d87e51a0f4b2a4d5fe5755627c24828afe057a7ee9b764c3ee777d84abd46218d173d8a204ee9cb3acdd321ff9a6b25f99c1c
+  checksum: 10/a3e806fb0b635818964d472d35d27e21a4e17150c679047f5501e1f23bd4aa806adf660f0c0d35214a210d5d440da6896c2e86156da55f221a57938278dc326e
   languageName: node
   linkType: hard
 

From 7750299a66396603d437344fb9fde2fe413b0364 Mon Sep 17 00:00:00 2001
From: "renovate[bot]" <29139614+renovate[bot]@users.noreply.github.com>
Date: Sat, 7 Dec 2024 22:33:51 +0100
Subject: [PATCH 08/12] Update dependency @types/leaflet to v1.9.15 (#23202)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
---
 package.json |  2 +-
 yarn.lock    | 10 +++++-----
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/package.json b/package.json
index 18b9fa2eecd3..b235d96bacf2 100644
--- a/package.json
+++ b/package.json
@@ -176,7 +176,7 @@
     "@types/glob": "8.1.0",
     "@types/html-minifier-terser": "7.0.2",
     "@types/js-yaml": "4.0.9",
-    "@types/leaflet": "1.9.14",
+    "@types/leaflet": "1.9.15",
     "@types/leaflet-draw": "1.0.11",
     "@types/lodash.merge": "4.6.9",
     "@types/luxon": "3.4.2",
diff --git a/yarn.lock b/yarn.lock
index 7d2b8b172d16..ba9045762a41 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4661,12 +4661,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/leaflet@npm:*, @types/leaflet@npm:1.9.14":
-  version: 1.9.14
-  resolution: "@types/leaflet@npm:1.9.14"
+"@types/leaflet@npm:*, @types/leaflet@npm:1.9.15":
+  version: 1.9.15
+  resolution: "@types/leaflet@npm:1.9.15"
   dependencies:
     "@types/geojson": "npm:*"
-  checksum: 10/70fbc69a4d6a3168a14072211e7738ad80954b8786105c4a0ec0615e88a5dbe131b1beff7b30594b293db2e1cb3f88a87d1ec1c89e128018bd42393dfcfcc69b
+  checksum: 10/b2ad97b8eae68be46b317350fd67bc5173db33be036c27d009b3e04bd7fb6fd52e9787a0825f45f35530faf5cb09ade98adc1836cbdbcf4089640f21ac53404f
   languageName: node
   linkType: hard
 
@@ -9175,7 +9175,7 @@ __metadata:
     "@types/glob": "npm:8.1.0"
     "@types/html-minifier-terser": "npm:7.0.2"
     "@types/js-yaml": "npm:4.0.9"
-    "@types/leaflet": "npm:1.9.14"
+    "@types/leaflet": "npm:1.9.15"
     "@types/leaflet-draw": "npm:1.0.11"
     "@types/lodash.merge": "npm:4.6.9"
     "@types/luxon": "npm:3.4.2"

From c78d371a9c46b400b132246905b1c752650bb1e5 Mon Sep 17 00:00:00 2001
From: Christopher Fenner <9592452+CFenner@users.noreply.github.com>
Date: Sun, 8 Dec 2024 18:21:34 +0100
Subject: [PATCH 09/12] Correct overwriting integration labelling on
 integrations page (#23206)

* Update ha-config-integration-page.ts

fixes #22776

* update icon color

---------

Co-authored-by: Petar Petrov <MindFreeze@users.noreply.github.com>
---
 .../integrations/ha-config-integration-page.ts | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/panels/config/integrations/ha-config-integration-page.ts b/src/panels/config/integrations/ha-config-integration-page.ts
index 54af33cf7b65..77d628a23218 100644
--- a/src/panels/config/integrations/ha-config-integration-page.ts
+++ b/src/panels/config/integrations/ha-config-integration-page.ts
@@ -368,11 +368,12 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
                     `
                   : nothing}
                 ${this._manifest?.is_built_in === false
-                  ? html`<div class="integration-info warn">
-                      <ha-svg-icon
-                        class="warning"
-                        path=${mdiPackageVariant}
-                      ></ha-svg-icon>
+                  ? html`<div
+                      class=${`integration-info ${
+                        this._manifest.overwrites_built_in ? "error" : "warn"
+                      }`}
+                    >
+                      <ha-svg-icon path=${mdiPackageVariant}></ha-svg-icon>
                       <a
                         href=${documentationUrl(
                           this.hass,
@@ -382,7 +383,9 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
                         target="_blank"
                       >
                         ${this.hass.localize(
-                          "ui.panel.config.integrations.config_entry.custom_integration"
+                          this._manifest.overwrites_built_in
+                            ? "ui.panel.config.integrations.config_entry.custom_overwrites_core"
+                            : "ui.panel.config.integrations.config_entry.custom_integration"
                         )}
                       </a>
                     </div>`
@@ -1530,6 +1533,9 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
         .integration-info.warn ha-svg-icon {
           color: var(--warning-color);
         }
+        .integration-info.error ha-svg-icon {
+          color: var(--error-color);
+        }
         .integration-info.info ha-svg-icon {
           color: var(--info-color);
         }

From 8390c6e29b02b5f1e4cb217b32ebdbcb3efd7e4b Mon Sep 17 00:00:00 2001
From: Paulus Schoutsen <balloob@gmail.com>
Date: Sun, 8 Dec 2024 16:32:43 -0500
Subject: [PATCH 10/12] Fix voice debug link (#23214)

---
 .../config/voice-assistants/assist-pref.ts    | 24 ++++++++++++-------
 1 file changed, 16 insertions(+), 8 deletions(-)

diff --git a/src/panels/config/voice-assistants/assist-pref.ts b/src/panels/config/voice-assistants/assist-pref.ts
index 8692d95680b1..86c1f0a60bba 100644
--- a/src/panels/config/voice-assistants/assist-pref.ts
+++ b/src/panels/config/voice-assistants/assist-pref.ts
@@ -42,6 +42,7 @@ import { showVoiceAssistantPipelineDetailDialog } from "./show-dialog-voice-assi
 import { showVoiceCommandDialog } from "../../../dialogs/voice-command-dialog/show-ha-voice-command-dialog";
 import { stopPropagation } from "../../../common/dom/stop_propagation";
 import { computeDomain } from "../../../common/entity/compute_domain";
+import { navigate } from "../../../common/navigate";
 
 @customElement("assist-pref")
 export class AssistPref extends LitElement {
@@ -159,14 +160,16 @@ export class AssistPref extends LitElement {
                     )}
                     <ha-svg-icon slot="graphic" .path=${mdiStar}></ha-svg-icon>
                   </ha-list-item>
-                  <a href=${`/config/voice-assistants/debug/${pipeline.id}`}>
-                    <ha-list-item graphic="icon">
-                      ${this.hass.localize(
-                        "ui.panel.config.voice_assistants.assistants.pipeline.detail.debug"
-                      )}
-                      <ha-svg-icon slot="graphic" .path=${mdiBug}></ha-svg-icon>
-                    </ha-list-item>
-                  </a>
+                  <ha-list-item
+                    graphic="icon"
+                    .id=${pipeline.id}
+                    @request-selected=${this._debugPipeline}
+                  >
+                    ${this.hass.localize(
+                      "ui.panel.config.voice_assistants.assistants.pipeline.detail.debug"
+                    )}
+                    <ha-svg-icon slot="graphic" .path=${mdiBug}></ha-svg-icon>
+                  </ha-list-item>
                   <ha-list-item
                     class="danger"
                     graphic="icon"
@@ -233,6 +236,11 @@ export class AssistPref extends LitElement {
     this._preferred = id;
   }
 
+  private async _debugPipeline(ev) {
+    const id = ev.currentTarget.id as string;
+    navigate(`/config/voice-assistants/debug/${id}`);
+  }
+
   private async _deletePipeline(ev) {
     const id = ev.currentTarget.id as string;
     if (this._preferred === id) {

From 9774deef6dd42c2ba4857954274189283b2c59cd Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Mon, 9 Dec 2024 08:52:56 +0200
Subject: [PATCH 11/12] Bump actions/cache from 4.1.2 to 4.2.0 (#23217)

Bumps [actions/cache](https://github.com/actions/cache) from 4.1.2 to 4.2.0.
- [Release notes](https://github.com/actions/cache/releases)
- [Changelog](https://github.com/actions/cache/blob/main/RELEASES.md)
- [Commits](https://github.com/actions/cache/compare/v4.1.2...v4.2.0)

---
updated-dependencies:
- dependency-name: actions/cache
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
---
 .github/workflows/ci.yaml | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/.github/workflows/ci.yaml b/.github/workflows/ci.yaml
index b1ab98e184dd..ebb7c49aef45 100644
--- a/.github/workflows/ci.yaml
+++ b/.github/workflows/ci.yaml
@@ -31,7 +31,7 @@ jobs:
         with:
           node-version-file: ".nvmrc"
           cache: yarn
-      - uses: actions/cache@v4.1.2
+      - uses: actions/cache@v4.2.0
         id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
         with:
           path: "node_modules"
@@ -43,7 +43,7 @@ jobs:
       - name: Build resources
         run: ./node_modules/.bin/gulp gen-icons-json build-translations build-locale-data gather-gallery-pages
       - name: Setup lint cache
-        uses: actions/cache@v4.1.2
+        uses: actions/cache@v4.2.0
         with:
           path: |
             node_modules/.cache/prettier
@@ -71,7 +71,7 @@ jobs:
         with:
           node-version-file: ".nvmrc"
           cache: yarn
-      - uses: actions/cache@v4.1.2
+      - uses: actions/cache@v4.2.0
         id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
         with:
           path: "node_modules"
@@ -97,7 +97,7 @@ jobs:
         with:
           node-version-file: ".nvmrc"
           cache: yarn
-      - uses: actions/cache@v4.1.2
+      - uses: actions/cache@v4.2.0
         id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
         with:
           path: "node_modules"
@@ -129,7 +129,7 @@ jobs:
         with:
           node-version-file: ".nvmrc"
           cache: yarn
-      - uses: actions/cache@v4.1.2
+      - uses: actions/cache@v4.2.0
         id: yarn-cache # use this to check for `cache-hit` (`steps.yarn-cache.outputs.cache-hit != 'true'`)
         with:
           path: "node_modules"

From bf24d6706644109c1f5e0478f24c940f6fdaa74e Mon Sep 17 00:00:00 2001
From: ildar170975 <71872483+ildar170975@users.noreply.github.com>
Date: Mon, 9 Dec 2024 10:06:18 +0300
Subject: [PATCH 12/12] Fix "Integration entries" page for yaml-based
 integrations (#23201)

* Update ha-config-integration-page.ts

* prettier
---
 .../ha-config-integration-page.ts             | 27 +++++++++----------
 1 file changed, 13 insertions(+), 14 deletions(-)

diff --git a/src/panels/config/integrations/ha-config-integration-page.ts b/src/panels/config/integrations/ha-config-integration-page.ts
index 77d628a23218..e6ed1e7b0c84 100644
--- a/src/panels/config/integrations/ha-config-integration-page.ts
+++ b/src/panels/config/integrations/ha-config-integration-page.ts
@@ -630,19 +630,18 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
                           "ui.panel.config.integrations.integration_page.no_entries"
                         )}
                   </div>`
-                : nothing}
-              <ha-md-list>
-                ${normalEntries.map(
-                  (item, index) =>
-                    html`${this._renderConfigEntry(item)}
-                    ${index < normalEntries.length - 1
-                      ? html` <ha-md-divider
-                          role="separator"
-                          tabindex="-1"
-                        ></ha-md-divider>`
-                      : nothing}`
-                )}
-              </ha-md-list>
+                : html`<ha-md-list>
+                    ${normalEntries.map(
+                      (item, index) =>
+                        html`${this._renderConfigEntry(item)}
+                        ${index < normalEntries.length - 1
+                          ? html` <ha-md-divider
+                              role="separator"
+                              tabindex="-1"
+                            ></ha-md-divider>`
+                          : nothing}`
+                    )}
+                  </ha-md-list>`}
               <div class="card-actions">
                 <ha-button @click=${this._addIntegration}>
                   ${this._manifest?.integration_type
@@ -1493,7 +1492,7 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
           padding-bottom: 0;
         }
         .no-entries {
-          padding-top: 12px;
+          padding: 12px 16px;
         }
         .logo-container {
           display: flex;