Disable attributes for hass, stateObj, selector, and route properties (#19362)

* Disable attribute for hass properties

* Disable attribute for stateObj properties

* Disable attribute for selector properties

* Disable attribute for route properties

* Switch from Object type to no attribute for same properties

gallery/src/components/demo-card.ts

@@ -11,7 +11,7 @@ export interface DemoCardConfig {
 
 @customElement("demo-card")
 class DemoCard extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property() public config!: DemoCardConfig;
 

gallery/src/components/demo-cards.ts

@@ -12,7 +12,7 @@ import "../ha-demo-options";
 class DemoCards extends LitElement {
   @property() public configs!: DemoCardConfig[];
 
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @state() private _showConfig = false;
 

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

@@ -8,7 +8,7 @@ import { HomeAssistant } from "../../../src/types";
 
 @customElement("demo-more-info")
 class DemoMoreInfo extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property() public entityId!: string;
 

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

@@ -9,7 +9,7 @@ import { HomeAssistant } from "../../../src/types";
 
 @customElement("demo-more-infos")
 class DemoMoreInfos extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property() public entities!: [];
 

gallery/src/pages/more-info/climate.ts

@@ -92,7 +92,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-climate")
 class DemoMoreInfoClimate extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/cover.ts

@@ -141,7 +141,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-cover")
 class DemoMoreInfoCover extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/humidifier.ts

@@ -29,7 +29,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-humidifier")
 class DemoMoreInfoHumidifier extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/input-number.ts

@@ -32,7 +32,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-input-number")
 class DemoMoreInfoInputNumber extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/input-text.ts

@@ -18,7 +18,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-input-text")
 class DemoMoreInfoInputText extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/light.ts

@@ -140,7 +140,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-light")
 class DemoMoreInfoLight extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/lock.ts

@@ -21,7 +21,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-lock")
 class DemoMoreInfoLock extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/media-player.ts

@@ -13,7 +13,7 @@ const ENTITIES = createMediaPlayerEntities();
 
 @customElement("demo-more-info-media-player")
 class DemoMoreInfoMediaPlayer extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/number.ts

@@ -50,7 +50,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-number")
 class DemoMoreInfoNumber extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/scene.ts

@@ -21,7 +21,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-scene")
 class DemoMoreInfoScene extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/timer.ts

@@ -18,7 +18,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-timer")
 class DemoMoreInfoTimer extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/update.ts

@@ -146,7 +146,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-update")
 class DemoMoreInfoUpdate extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/vacuum.ts

@@ -22,7 +22,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-vacuum")
 class DemoMoreInfoVacuum extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

gallery/src/pages/more-info/water-heater.ts

@@ -42,7 +42,7 @@ const ENTITIES = [
 
 @customElement("demo-more-info-water-heater")
 class DemoMoreInfoWaterHeater extends LitElement {
-  @property() public hass!: MockHomeAssistant;
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
 
   @query("demo-more-infos") private _demoRoot!: HTMLElement;
 

hassio/src/backups/hassio-backups.ts

@@ -59,7 +59,7 @@ export class HassioBackups extends LitElement {
 
   @property({ attribute: false }) public supervisor!: Supervisor;
 
-  @property({ type: Object }) public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @property({ type: Boolean }) public narrow!: boolean;
 

src/components/entity/ha-entity-toggle.ts

@@ -29,7 +29,7 @@ export class HaEntityToggle extends LitElement {
   // hass is not a property so that we only re-render on stateObj changes
   public hass?: HomeAssistant;
 
-  @property() public stateObj?: HassEntity;
+  @property({ attribute: false }) public stateObj?: HassEntity;
 
   @property() public label?: string;
 

src/components/entity/state-badge.ts

@@ -26,7 +26,7 @@ import "../ha-state-icon";
 export class StateBadge extends LitElement {
   public hass?: HomeAssistant;
 
-  @property() public stateObj?: HassEntity;
+  @property({ attribute: false }) public stateObj?: HassEntity;
 
   @property() public overrideIcon?: string;
 

src/components/ha-attribute-value.ts

@@ -9,7 +9,7 @@ import { HomeAssistant } from "../types";
 class HaAttributeValue extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: HassEntity;
+  @property({ attribute: false }) public stateObj?: HassEntity;
 
   @property() public attribute!: string;
 

src/components/ha-attributes.ts

@@ -19,7 +19,7 @@ import "./ha-expansion-panel";
 class HaAttributes extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: HassEntity;
+  @property({ attribute: false }) public stateObj?: HassEntity;
 
   @property({ attribute: "extra-filters" }) public extraFilters?: string;
 

src/components/ha-button-related-filter-menu.ts

@@ -33,7 +33,7 @@ interface FilterValue {
 
 @customElement("ha-button-related-filter-menu")
 export class HaRelatedFilterButtonMenu extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property() public corner: Corner = "BOTTOM_START";
 

src/components/ha-dialog-date-picker.ts

@@ -12,7 +12,7 @@ import "./ha-dialog";
 
 @customElement("ha-dialog-date-picker")
 export class HaDialogDatePicker extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property() public value?: string;
 

src/components/ha-form/ha-form-string.ts

@@ -25,7 +25,7 @@ const MASKED_FIELDS = ["password", "secret", "token"];
 
 @customElement("ha-form-string")
 export class HaFormString extends LitElement implements HaFormElement {
-  @property() public hass?: HomeAssistant;
+  @property({ attribute: false }) public hass?: HomeAssistant;
 
   @property() public schema!: HaFormStringSchema;
 

src/components/ha-icon-picker.ts

@@ -74,7 +74,7 @@ const rowRenderer: ComboBoxLitRenderer<IconItem | RankedIcon> = (item) =>
 
 @customElement("ha-icon-picker")
 export class HaIconPicker extends LitElement {
-  @property() public hass?: HomeAssistant;
+  @property({ attribute: false }) public hass?: HomeAssistant;
 
   @property() public value?: string;
 

src/components/ha-navigation-picker.ts

@@ -50,7 +50,7 @@ const createPanelNavigationItem = (hass: HomeAssistant, panel: PanelInfo) => ({
 
 @customElement("ha-navigation-picker")
 export class HaNavigationPicker extends LitElement {
-  @property() public hass?: HomeAssistant;
+  @property({ attribute: false }) public hass?: HomeAssistant;
 
   @property() public label?: string;
 

src/components/ha-selector/ha-selector-action.ts

@@ -7,9 +7,9 @@ import { HomeAssistant } from "../../types";
 
 @customElement("ha-selector-action")
 export class HaActionSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: ActionSelector;
+  @property({ attribute: false }) public selector!: ActionSelector;
 
   @property() public value?: Action;
 

src/components/ha-selector/ha-selector-addon.ts

@@ -6,9 +6,9 @@ import "../ha-addon-picker";
 
 @customElement("ha-selector-addon")
 export class HaAddonSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: AddonSelector;
+  @property({ attribute: false }) public selector!: AddonSelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-area-filter.ts

@@ -6,9 +6,9 @@ import "../ha-area-filter";
 
 @customElement("ha-selector-area_filter")
 export class HaAreaFilterSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: AreaFilterSelector;
+  @property({ attribute: false }) public selector!: AreaFilterSelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-area.ts

@@ -21,9 +21,9 @@ import "../ha-areas-picker";
 
 @customElement("ha-selector-area")
 export class HaAreaSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: AreaSelector;
+  @property({ attribute: false }) public selector!: AreaSelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-assist-pipeline.ts

@@ -6,9 +6,9 @@ import "../ha-assist-pipeline-picker";
 
 @customElement("ha-selector-assist_pipeline")
 export class HaAssistPipelineSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: AssistPipelineSelector;
+  @property({ attribute: false }) public selector!: AssistPipelineSelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-backup-location.ts

@@ -6,9 +6,9 @@ import "../ha-mount-picker";
 
 @customElement("ha-selector-backup_location")
 export class HaBackupLocationSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: BackupLocationSelector;
+  @property({ attribute: false }) public selector!: BackupLocationSelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-boolean.ts

@@ -8,7 +8,7 @@ import "../ha-input-helper-text";
 
 @customElement("ha-selector-boolean")
 export class HaBooleanSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property({ type: Boolean }) public value = false;
 

src/components/ha-selector/ha-selector-color-temp.ts

@@ -15,9 +15,9 @@ import {
 
 @customElement("ha-selector-color_temp")
 export class HaColorTempSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: ColorTempSelector;
+  @property({ attribute: false }) public selector!: ColorTempSelector;
 
   @property() public value?: string;
 

src/components/ha-selector/ha-selector-condition.ts

@@ -7,9 +7,9 @@ import { HomeAssistant } from "../../types";
 
 @customElement("ha-selector-condition")
 export class HaConditionSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: ConditionSelector;
+  @property({ attribute: false }) public selector!: ConditionSelector;
 
   @property() public value?: Condition;
 

src/components/ha-selector/ha-selector-constant.ts

@@ -4,7 +4,7 @@ import { ConstantSelector } from "../../data/selector";
 
 @customElement("ha-selector-constant")
 export class HaSelectorConstant extends LitElement {
-  @property() public selector!: ConstantSelector;
+  @property({ attribute: false }) public selector!: ConstantSelector;
 
   @property({ type: Boolean }) public disabled = false;
 

src/components/ha-selector/ha-selector-conversation-agent.ts

@@ -6,9 +6,9 @@ import "../ha-conversation-agent-picker";
 
 @customElement("ha-selector-conversation_agent")
 export class HaConversationAgentSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: ConversationAgentSelector;
+  @property({ attribute: false }) public selector!: ConversationAgentSelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-country.ts

@@ -6,9 +6,9 @@ import "../ha-country-picker";
 
 @customElement("ha-selector-country")
 export class HaCountrySelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: CountrySelector;
+  @property({ attribute: false }) public selector!: CountrySelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-date.ts

@@ -6,9 +6,9 @@ import "../ha-date-input";
 
 @customElement("ha-selector-date")
 export class HaDateSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: DateSelector;
+  @property({ attribute: false }) public selector!: DateSelector;
 
   @property() public value?: string;
 

src/components/ha-selector/ha-selector-device.ts

@@ -21,9 +21,9 @@ import "../device/ha-devices-picker";
 
 @customElement("ha-selector-device")
 export class HaDeviceSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: DeviceSelector;
+  @property({ attribute: false }) public selector!: DeviceSelector;
 
   @state() private _entitySources?: EntitySources;
 

src/components/ha-selector/ha-selector-entity.ts

@@ -15,9 +15,9 @@ import "../entity/ha-entity-picker";
 
 @customElement("ha-selector-entity")
 export class HaEntitySelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: EntitySelector;
+  @property({ attribute: false }) public selector!: EntitySelector;
 
   @state() private _entitySources?: EntitySources;
 

src/components/ha-selector/ha-selector-file.ts

@@ -10,9 +10,9 @@ import "../ha-file-upload";
 
 @customElement("ha-selector-file")
 export class HaFileSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: FileSelector;
+  @property({ attribute: false }) public selector!: FileSelector;
 
   @property() public value?: string;
 

src/components/ha-selector/ha-selector-icon.ts

@@ -9,9 +9,9 @@ import "../ha-icon-picker";
 
 @customElement("ha-selector-icon")
 export class HaIconSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: IconSelector;
+  @property({ attribute: false }) public selector!: IconSelector;
 
   @property() public value?: string;
 

src/components/ha-selector/ha-selector-language.ts

@@ -6,9 +6,9 @@ import "../ha-language-picker";
 
 @customElement("ha-selector-language")
 export class HaLanguageSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: LanguageSelector;
+  @property({ attribute: false }) public selector!: LanguageSelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-navigation.ts

@@ -7,9 +7,9 @@ import "../ha-navigation-picker";
 
 @customElement("ha-selector-navigation")
 export class HaNavigationSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: NavigationSelector;
+  @property({ attribute: false }) public selector!: NavigationSelector;
 
   @property() public value?: string;
 

src/components/ha-selector/ha-selector-number.ts

@@ -10,9 +10,9 @@ import "../ha-textfield";
 
 @customElement("ha-selector-number")
 export class HaNumberSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: NumberSelector;
+  @property({ attribute: false }) public selector!: NumberSelector;
 
   @property({ type: Number }) public value?: number;
 

src/components/ha-selector/ha-selector-object.ts

@@ -8,7 +8,7 @@ import type { HaYamlEditor } from "../ha-yaml-editor";
 
 @customElement("ha-selector-object")
 export class HaObjectSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-state.ts

@@ -7,9 +7,9 @@ import "../entity/ha-entity-state-picker";
 
 @customElement("ha-selector-state")
 export class HaSelectorState extends SubscribeMixin(LitElement) {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: StateSelector;
+  @property({ attribute: false }) public selector!: StateSelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-statistic.ts

@@ -6,9 +6,9 @@ import "../entity/ha-statistics-picker";
 
 @customElement("ha-selector-statistic")
 export class HaStatisticSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: StatisticSelector;
+  @property({ attribute: false }) public selector!: StatisticSelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-stt.ts

@@ -6,9 +6,9 @@ import "../ha-stt-picker";
 
 @customElement("ha-selector-stt")
 export class HaSTTSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: STTSelector;
+  @property({ attribute: false }) public selector!: STTSelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-target.ts

@@ -28,9 +28,9 @@ import "../ha-target-picker";
 
 @customElement("ha-selector-target")
 export class HaTargetSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: TargetSelector;
+  @property({ attribute: false }) public selector!: TargetSelector;
 
   @property() public value?: HassServiceTarget;
 

src/components/ha-selector/ha-selector-template.ts

@@ -7,7 +7,7 @@ import "../ha-input-helper-text";
 
 @customElement("ha-selector-template")
 export class HaTemplateSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property() public value?: string;
 

src/components/ha-selector/ha-selector-text.ts

@@ -12,7 +12,7 @@ import "../ha-textfield";
 
 @customElement("ha-selector-text")
 export class HaTextSelector extends LitElement {
-  @property() public hass?: HomeAssistant;
+  @property({ attribute: false }) public hass?: HomeAssistant;
 
   @property() public value?: any;
 
@@ -24,7 +24,7 @@ export class HaTextSelector extends LitElement {
 
   @property() public helper?: string;
 
-  @property() public selector!: StringSelector;
+  @property({ attribute: false }) public selector!: StringSelector;
 
   @property({ type: Boolean }) public disabled = false;
 

src/components/ha-selector/ha-selector-trigger.ts

@@ -7,9 +7,9 @@ import { HomeAssistant } from "../../types";
 
 @customElement("ha-selector-trigger")
 export class HaTriggerSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: TriggerSelector;
+  @property({ attribute: false }) public selector!: TriggerSelector;
 
   @property() public value?: Trigger;
 

src/components/ha-selector/ha-selector-tts-voice.ts

@@ -6,9 +6,9 @@ import "../ha-tts-voice-picker";
 
 @customElement("ha-selector-tts_voice")
 export class HaTTSVoiceSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: TTSVoiceSelector;
+  @property({ attribute: false }) public selector!: TTSVoiceSelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-tts.ts

@@ -6,9 +6,9 @@ import "../ha-tts-picker";
 
 @customElement("ha-selector-tts")
 export class HaTTSSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: TTSSelector;
+  @property({ attribute: false }) public selector!: TTSSelector;
 
   @property() public value?: any;
 

src/components/ha-selector/ha-selector-ui-action.ts

@@ -8,9 +8,9 @@ import { HomeAssistant } from "../../types";
 
 @customElement("ha-selector-ui_action")
 export class HaSelectorUiAction extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: UiActionSelector;
+  @property({ attribute: false }) public selector!: UiActionSelector;
 
   @property() public value?: ActionConfig;
 

src/components/ha-selector/ha-selector-ui-color.ts

@@ -7,9 +7,9 @@ import { HomeAssistant } from "../../types";
 
 @customElement("ha-selector-ui_color")
 export class HaSelectorUiColor extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public selector!: UiColorSelector;
+  @property({ attribute: false }) public selector!: UiColorSelector;
 
   @property() public value?: string;
 

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

@@ -59,11 +59,11 @@ const LEGACY_UI_SELECTORS = new Set(["ui-action", "ui-color"]);
 
 @customElement("ha-selector")
 export class HaSelector extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property() public name?: string;
 
-  @property() public selector!: Selector;
+  @property({ attribute: false }) public selector!: Selector;
 
   @property() public value?: any;
 

src/components/ha-sidebar.ts

@@ -191,7 +191,7 @@ class HaSidebar extends SubscribeMixin(LitElement) {
 
   @property({ type: Boolean, reflect: true }) public narrow!: boolean;
 
-  @property() public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @property({ type: Boolean }) public alwaysExpand = false;
 

src/components/media-player/ha-browse-media-tts.ts

@@ -31,7 +31,7 @@ declare global {
 
 @customElement("ha-browse-media-tts")
 class BrowseMediaTTS extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property() public item!: MediaPlayerItem;
 

src/dialogs/more-info/components/lights/ha-favorite-color-button.ts

@@ -24,7 +24,7 @@ class MoreInfoViewLightColorPicker extends LitElement {
 
   @property({ type: Boolean, reflect: true }) disabled = false;
 
-  @property() stateObj?: LightEntity;
+  @property({ attribute: false }) public stateObj?: LightEntity;
 
   @property() color!: LightColor;
 

src/dialogs/more-info/controls/more-info-climate.ts

@@ -38,7 +38,7 @@ type MainControl = "temperature" | "humidity";
 class MoreInfoClimate extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: ClimateEntity;
+  @property({ attribute: false }) public stateObj?: ClimateEntity;
 
   @state() private _mainControl: MainControl = "temperature";
 

src/dialogs/more-info/controls/more-info-counter.ts

@@ -9,7 +9,7 @@ import { HomeAssistant } from "../../../types";
 class MoreInfoCounter extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: HassEntity;
+  @property({ attribute: false }) public stateObj?: HassEntity;
 
   protected render() {
     if (!this.hass || !this.stateObj) {

src/dialogs/more-info/controls/more-info-default.ts

@@ -8,7 +8,7 @@ import { HomeAssistant } from "../../../types";
 class MoreInfoDefault extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: HassEntity;
+  @property({ attribute: false }) public stateObj?: HassEntity;
 
   protected render() {
     if (!this.hass || !this.stateObj) {

src/dialogs/more-info/controls/more-info-group.ts

@@ -21,7 +21,7 @@ import {
 class MoreInfoGroup extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: GroupEntity;
+  @property({ attribute: false }) public stateObj?: GroupEntity;
 
   @state() private _groupDomainStateObj?: HassEntity;
 

src/dialogs/more-info/controls/more-info-humidifier.ts

@@ -26,7 +26,7 @@ import { moreInfoControlStyle } from "../components/more-info-control-style";
 class MoreInfoHumidifier extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: HumidifierEntity;
+  @property({ attribute: false }) public stateObj?: HumidifierEntity;
 
   @state() public _mode?: string;
 

src/dialogs/more-info/controls/more-info-lawn_mower.ts

@@ -54,7 +54,7 @@ const LAWN_MOWER_COMMANDS: LawnMowerCommand[] = [
 class MoreInfoLawnMower extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: LawnMowerEntity;
+  @property({ attribute: false }) public stateObj?: LawnMowerEntity;
 
   protected render() {
     if (!this.hass || !this.stateObj) {

src/dialogs/more-info/controls/more-info-person.ts

@@ -13,7 +13,7 @@ import { HomeAssistant } from "../../../types";
 class MoreInfoPerson extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: HassEntity;
+  @property({ attribute: false }) public stateObj?: HassEntity;
 
   private _entityArray = memoizeOne((entityId: string) => [entityId]);
 

src/dialogs/more-info/controls/more-info-remote.ts

@@ -14,7 +14,7 @@ const filterExtraAttributes = "activity_list,current_activity";
 class MoreInfoRemote extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: RemoteEntity;
+  @property({ attribute: false }) public stateObj?: RemoteEntity;
 
   protected render() {
     if (!this.hass || !this.stateObj) {

src/dialogs/more-info/controls/more-info-script.ts

@@ -8,7 +8,7 @@ import { HomeAssistant } from "../../../types";
 class MoreInfoScript extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: HassEntity;
+  @property({ attribute: false }) public stateObj?: HassEntity;
 
   protected render() {
     if (!this.hass || !this.stateObj) {

src/dialogs/more-info/controls/more-info-sun.ts

@@ -9,7 +9,7 @@ import { HomeAssistant } from "../../../types";
 class MoreInfoSun extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: HassEntity;
+  @property({ attribute: false }) public stateObj?: HassEntity;
 
   protected render() {
     if (!this.hass || !this.stateObj) {

src/dialogs/more-info/controls/more-info-timer.ts

@@ -9,7 +9,7 @@ import { HomeAssistant } from "../../../types";
 class MoreInfoTimer extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: TimerEntity;
+  @property({ attribute: false }) public stateObj?: TimerEntity;
 
   protected render() {
     if (!this.hass || !this.stateObj) {

src/dialogs/more-info/controls/more-info-vacuum.ts

@@ -100,7 +100,7 @@ const VACUUM_COMMANDS: VacuumCommand[] = [
 class MoreInfoVacuum extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: VacuumEntity;
+  @property({ attribute: false }) public stateObj?: VacuumEntity;
 
   protected render() {
     if (!this.hass || !this.stateObj) {

src/dialogs/more-info/controls/more-info-water_heater.ts

@@ -21,7 +21,7 @@ import { moreInfoControlStyle } from "../components/more-info-control-style";
 class MoreInfoWaterHeater extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: WaterHeaterEntity;
+  @property({ attribute: false }) public stateObj?: WaterHeaterEntity;
 
   protected render() {
     if (!this.stateObj) {

src/dialogs/more-info/controls/more-info-weather.ts

@@ -37,7 +37,7 @@ import { HomeAssistant } from "../../../types";
 class MoreInfoWeather extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public stateObj?: WeatherEntity;
+  @property({ attribute: false }) public stateObj?: WeatherEntity;
 
   @state() private _forecastEvent?: ForecastEvent;
 

src/layouts/hass-router-page.ts

@@ -46,7 +46,7 @@ export interface RouterOptions {
 const LOADING_SCREEN_THRESHOLD = 400; // ms
 
 export class HassRouterPage extends ReactiveElement {
-  @property() public route?: Route;
+  @property({ attribute: false }) public route?: Route;
 
   protected routerOptions!: RouterOptions;
 

src/layouts/hass-tabs-subpage-data-table.ts

@@ -130,7 +130,7 @@ export class HaTabsSubpageDataTable extends LitElement {
    */
   @property({ type: Boolean }) public empty = false;
 
-  @property() public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   /**
    * Array of tabs to show on the page.

src/layouts/home-assistant-main.ts

@@ -38,7 +38,7 @@ interface EditSideBarEvent {
 export class HomeAssistantMain extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property() public route?: Route;
+  @property({ attribute: false }) public route?: Route;
 
   @property({ type: Boolean }) public narrow!: boolean;
 

src/panels/calendar/ha-recurrence-rule-editor.ts

@@ -33,7 +33,7 @@ import {
 
 @customElement("ha-recurrence-rule-editor")
 export class RecurrenceRuleEditor extends LitElement {
-  @property() public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property({ type: Boolean }) public disabled = false;
 

src/panels/config/application_credentials/ha-config-application-credentials.ts

@@ -45,7 +45,7 @@ export class HaConfigApplicationCredentials extends LitElement {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property() public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @state() private _selected: string[] = [];
 

src/panels/config/areas/ha-config-areas-dashboard.ts

@@ -40,7 +40,7 @@ export class HaConfigAreasDashboard extends SubscribeMixin(LitElement) {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property() public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @state() private _areas!: AreaRegistryEntry[];
 

src/panels/config/automation/blueprint-automation-editor.ts

@@ -32,7 +32,7 @@ export class HaBlueprintAutomationEditor extends LitElement {
 
   @property() public config!: BlueprintAutomationConfig;
 
-  @property() public stateObj?: HassEntity;
+  @property({ attribute: false }) public stateObj?: HassEntity;
 
   @state() private _blueprints?: Blueprints;
 

src/panels/config/automation/ha-automation-editor.ts

@@ -93,7 +93,7 @@ export class HaAutomationEditor extends KeyboardShortcutMixin(LitElement) {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property() public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @state() private _config?: AutomationConfig;
 

src/panels/config/automation/ha-automation-picker.ts

@@ -77,7 +77,7 @@ class HaAutomationPicker extends LitElement {
 
   @property({ type: Boolean }) public narrow!: boolean;
 
-  @property() public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @property() public automations!: AutomationEntity[];
 

src/panels/config/cloud/ha-config-cloud.ts

@@ -20,7 +20,7 @@ class HaConfigCloud extends HassRouterPage {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property() public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @property() public cloudStatus!: CloudStatus;
 

src/panels/config/devices/ha-config-devices-dashboard.ts

@@ -74,7 +74,7 @@ export class HaConfigDeviceDashboard extends LitElement {
 
   @property() public manifests!: IntegrationManifest[];
 
-  @property() public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @state() private _searchParms = new URLSearchParams(window.location.search);
 

src/panels/config/ha-panel-config.ts

@@ -362,7 +362,7 @@ class HaPanelConfig extends SubscribeMixin(HassRouterPage) {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property() public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   private _entitiesContext = new ContextProvider(this, {
     context: fullEntitiesContext,

src/panels/config/helpers/ha-config-helpers.ts

@@ -85,7 +85,7 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) {
 
   @property({ type: Boolean }) public narrow = false;
 
-  @property() public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @state() private _stateItems: HassEntity[] = [];
 

src/panels/config/integrations/ha-config-integrations-dashboard.ts

@@ -98,7 +98,7 @@ class HaConfigIntegrationsDashboard extends SubscribeMixin(LitElement) {
 
   @property({ type: Boolean }) public showAdvanced = false;
 
-  @property() public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @property({ attribute: false }) public configEntries?: ConfigEntryExtended[];
 

src/panels/config/integrations/integration-panels/zha/zha-add-group-page.ts

@@ -20,7 +20,7 @@ import type { ZHADeviceEndpointDataTable } from "./zha-device-endpoint-data-tabl
 
 @customElement("zha-add-group-page")
 export class ZHAAddGroupPage extends LitElement {
-  @property({ type: Object }) public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property({ type: Boolean }) public narrow!: boolean;
 

src/panels/config/integrations/integration-panels/zha/zha-config-dashboard.ts

@@ -68,9 +68,9 @@ export const zhaTabs: PageNavigation[] = [
 
 @customElement("zha-config-dashboard")
 class ZHAConfigDashboard extends LitElement {
-  @property({ type: Object }) public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ type: Object }) public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @property({ type: Boolean }) public narrow!: boolean;
 

src/panels/config/integrations/integration-panels/zha/zha-device-endpoint-data-table.ts

@@ -25,7 +25,7 @@ export interface DeviceEndpointRowData extends DataTableRowData {
 
 @customElement("zha-device-endpoint-data-table")
 export class ZHADeviceEndpointDataTable extends LitElement {
-  @property({ type: Object }) public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property({ type: Boolean }) public narrow = false;
 

src/panels/config/integrations/integration-panels/zha/zha-group-page.ts

@@ -33,7 +33,7 @@ import type { ZHADeviceEndpointDataTable } from "./zha-device-endpoint-data-tabl
 
 @customElement("zha-group-page")
 export class ZHAGroupPage extends LitElement {
-  @property({ type: Object }) public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
   @property({ type: Object }) public group?: ZHAGroup;
 

src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts

@@ -34,7 +34,7 @@ export interface GroupRowData extends ZHAGroup {
 export class ZHAGroupsDashboard extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ type: Object }) public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @property({ type: Boolean }) public narrow!: boolean;
 

src/panels/config/integrations/integration-panels/zwave_js/zwave_js-config-dashboard.ts

@@ -57,9 +57,9 @@ import { configTabs } from "./zwave_js-config-router";
 
 @customElement("zwave_js-config-dashboard")
 class ZWaveJSConfigDashboard extends SubscribeMixin(LitElement) {
-  @property({ type: Object }) public hass!: HomeAssistant;
+  @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ type: Object }) public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @property({ type: Boolean }) public narrow!: boolean;
 

src/panels/config/integrations/integration-panels/zwave_js/zwave_js-logs.ts

@@ -23,7 +23,7 @@ import { configTabs } from "./zwave_js-config-router";
 class ZWaveJSLogs extends SubscribeMixin(LitElement) {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ type: Object }) public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @property({ type: Boolean }) public narrow!: boolean;
 

src/panels/config/integrations/integration-panels/zwave_js/zwave_js-provisioned.ts

@@ -18,7 +18,7 @@ import { configTabs } from "./zwave_js-config-router";
 class ZWaveJSProvisioned extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ type: Object }) public route!: Route;
+  @property({ attribute: false }) public route!: Route;
 
   @property({ type: Boolean }) public narrow!: boolean;