Show 24h graph for sensor in climate view

demo/src/html/index.html.template

@@ -68,7 +68,7 @@
       }
       #ha-launch-screen .ha-launch-screen-spacer-top {
         flex: 1;
-        margin-top: calc( 2 * max(var(--safe-area-inset-top, 0px), 48px) + 46px );
+        margin-top: calc( 2 * max(var(--safe-area-inset-bottom, 0px), 48px) + 46px );
         padding-top: 48px;
       }
       #ha-launch-screen .ha-launch-screen-spacer-bottom {

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

@@ -1,11 +1,10 @@
-import { LitElement, css, html, nothing } from "lit";
+import { LitElement, css, html } from "lit";
 import { customElement, property } from "lit/decorators";
 import "../../../src/components/ha-card";
 import "../../../src/dialogs/more-info/more-info-content";
 import "../../../src/state-summary/state-card-content";
 import "../ha-demo-options";
 import type { HomeAssistant } from "../../../src/types";
-import { computeShowNewMoreInfo } from "../../../src/dialogs/more-info/const";
 
 @customElement("demo-more-info")
 class DemoMoreInfo extends LitElement {
@@ -22,13 +21,11 @@ class DemoMoreInfo extends LitElement {
       <div class="root">
         <div id="card">
           <ha-card>
-            ${!computeShowNewMoreInfo(state)
-              ? html`<state-card-content
-                  .stateObj=${state}
-                  .hass=${this.hass}
-                  in-dialog
-                ></state-card-content>`
-              : nothing}
+            <state-card-content
+              .stateObj=${state}
+              .hass=${this.hass}
+              in-dialog
+            ></state-card-content>
 
             <more-info-content
               .hass=${this.hass}

landing-page/src/html/index.html.template

@@ -19,9 +19,8 @@
         height: auto;
         padding: 32px 0;
       }
-
       .content {
-        max-width: min(560px, calc(100vw - var(--safe-area-inset-right, 0px) - var(--safe-area-inset-left, 0px)));
+        max-width: 560px;
         margin: 0 auto;
         padding: 0 16px;
         box-sizing: content-box;

package.json

@@ -29,13 +29,13 @@
     "@awesome.me/webawesome": "3.0.0-beta.4",
     "@babel/runtime": "7.28.3",
     "@braintree/sanitize-url": "7.1.1",
-    "@codemirror/autocomplete": "6.18.7",
+    "@codemirror/autocomplete": "6.18.6",
     "@codemirror/commands": "6.8.1",
     "@codemirror/language": "6.11.3",
     "@codemirror/legacy-modes": "6.5.1",
     "@codemirror/search": "6.5.11",
     "@codemirror/state": "6.5.2",
-    "@codemirror/view": "6.38.2",
+    "@codemirror/view": "6.38.1",
     "@egjs/hammerjs": "2.0.17",
     "@formatjs/intl-datetimeformat": "6.18.0",
     "@formatjs/intl-displaynames": "6.8.11",
@@ -159,18 +159,18 @@
     "@octokit/plugin-retry": "8.0.1",
     "@octokit/rest": "22.0.0",
     "@rsdoctor/rspack-plugin": "1.2.3",
-    "@rspack/core": "1.5.2",
+    "@rspack/core": "1.5.1",
     "@rspack/dev-server": "1.1.4",
     "@types/babel__plugin-transform-runtime": "7.9.5",
     "@types/chromecast-caf-receiver": "6.0.24",
     "@types/chromecast-caf-sender": "1.0.11",
     "@types/color-name": "2.0.0",
-    "@types/culori": "4.0.1",
+    "@types/culori": "4.0.0",
     "@types/html-minifier-terser": "7.0.2",
     "@types/js-yaml": "4.0.9",
     "@types/leaflet": "1.9.20",
-    "@types/leaflet-draw": "1.0.13",
-    "@types/leaflet.markercluster": "1.5.6",
+    "@types/leaflet-draw": "1.0.12",
+    "@types/leaflet.markercluster": "1.5.5",
     "@types/lodash.merge": "4.6.9",
     "@types/luxon": "3.7.1",
     "@types/mocha": "10.0.10",
@@ -204,7 +204,7 @@
     "husky": "9.1.7",
     "jsdom": "26.1.0",
     "jszip": "3.10.1",
-    "lint-staged": "16.1.6",
+    "lint-staged": "16.1.5",
     "lit-analyzer": "2.0.3",
     "lodash.merge": "4.6.2",
     "lodash.template": "4.5.0",
@@ -218,7 +218,7 @@
     "terser-webpack-plugin": "5.3.14",
     "ts-lit-plugin": "2.0.2",
     "typescript": "5.9.2",
-    "typescript-eslint": "8.42.0",
+    "typescript-eslint": "8.41.0",
     "vite-tsconfig-paths": "5.1.4",
     "vitest": "3.2.4",
     "webpack-stats-plugin": "1.1.3",

pyproject.toml

@@ -4,7 +4,7 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name         = "home-assistant-frontend"
-version      = "20250903.0"
+version      = "20250827.0"
 license      = "Apache-2.0"
 license-files = ["LICENSE*"]
 description  = "The Home Assistant frontend"

src/common/entity/entity_filter.ts

@@ -67,7 +67,10 @@ export const generateEntityFilter = (
     }
 
     if (floors) {
-      if (!floor || !floors.has(floor.floor_id)) {
+      if (!floor) {
+        return false;
+      }
+      if (!floors) {
         return false;
       }
     }

src/components/ha-automation-row.ts

@@ -88,10 +88,7 @@ export class HaAutomationRow extends LitElement {
         (ev.ctrlKey || ev.metaKey) &&
         !ev.shiftKey &&
         !ev.altKey &&
-        (ev.key === "c" ||
-          ev.key === "x" ||
-          ev.key === "Delete" ||
-          ev.key === "Backspace")
+        (ev.key === "c" || ev.key === "x" || ev.key === "Delete")
       )
     ) {
       return;
@@ -122,7 +119,7 @@ export class HaAutomationRow extends LitElement {
         return;
       }
 
-      if (ev.key === "Delete" || ev.key === "Backspace") {
+      if (ev.key === "Delete") {
         fireEvent(this, "delete-row");
         return;
       }
@@ -159,7 +156,6 @@ export class HaAutomationRow extends LitElement {
     .expand-button {
       transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1);
       color: var(--ha-color-on-neutral-quiet);
-      margin-left: -8px;
     }
     :host([building-block]) .leading-icon-wrapper {
       background-color: var(--ha-color-fill-neutral-loud-resting);

src/components/ha-bottom-sheet.ts

@@ -232,6 +232,7 @@ export class HaBottomSheet extends LitElement {
       box-shadow: var(--wa-shadow-l);
       padding: 0;
       margin: 0;
+
       top: auto;
       inset-inline-end: auto;
       bottom: 0;

src/components/ha-md-dialog.ts

@@ -159,7 +159,6 @@ export class HaMdDialog extends Dialog {
         --md-dialog-headline-size: var(--ha-font-size-xl);
         --md-dialog-supporting-text-size: var(--ha-font-size-m);
         --md-dialog-supporting-text-line-height: var(--ha-line-height-normal);
-        --md-divider-color: var(--divider-color);
       }
 
       :host([type="alert"]) {

src/data/bluetooth.ts

@@ -24,14 +24,11 @@ export interface BluetoothConnectionData extends DataTableRowData {
   source: string;
 }
 
-export type HaScannerType = "usb" | "uart" | "remote" | "unknown";
-
 export interface BluetoothScannerDetails {
   source: string;
   connectable: boolean;
   name: string;
   adapter: string;
-  scanner_type?: HaScannerType;
 }
 
 export type BluetoothScannersDetails = Record<string, BluetoothScannerDetails>;
@@ -58,13 +55,6 @@ export interface BluetoothAllocationsData {
   allocated: string[];
 }
 
-export interface BluetoothScannerState {
-  source: string;
-  adapter: string;
-  current_mode: "active" | "passive" | null;
-  requested_mode: "active" | "passive" | null;
-}
-
 export const subscribeBluetoothScannersDetailsUpdates = (
   conn: Connection,
   store: Store<BluetoothScannersDetails>
@@ -180,20 +170,3 @@ export const subscribeBluetoothConnectionAllocations = (
     params
   );
 };
-
-export const subscribeBluetoothScannerState = (
-  conn: Connection,
-  callbackFunction: (scannerState: BluetoothScannerState) => void,
-  configEntryId?: string
-): Promise<() => Promise<void>> => {
-  const params: { type: string; config_entry_id?: string } = {
-    type: "bluetooth/subscribe_scanner_state",
-  };
-  if (configEntryId) {
-    params.config_entry_id = configEntryId;
-  }
-  return conn.subscribeMessage<BluetoothScannerState>(
-    (scannerState) => callbackFunction(scannerState),
-    params
-  );
-};

src/data/data_entry_flow.ts

@@ -97,7 +97,6 @@ export interface DataEntryFlowStepMenu {
   step_id: string;
   /** If array, use value to lookup translations in strings.json */
   menu_options: string[] | Record<string, string>;
-  sort?: boolean;
   description_placeholders?: Record<string, string>;
   translation_domain?: string;
 }

src/data/graph.ts

@@ -1 +1 @@
-export const strokeWidth = 2;
+export const strokeWidth = 5;

src/data/recorder.ts

@@ -2,7 +2,6 @@ import type { Connection } from "home-assistant-js-websocket";
 import { computeStateName } from "../common/entity/compute_state_name";
 import type { HaDurationData } from "../components/ha-duration-input";
 import type { HomeAssistant } from "../types";
-import { firstWeekday } from "../common/datetime/first_weekday";
 
 export interface RecorderInfo {
   backlog: number | null;
@@ -109,7 +108,7 @@ export interface StatisticsValidationResultMeanTypeChanged {
   };
 }
 
-export const VOLUME_UNITS = ["L", "gal", "ft³", "m³", "CCF", "MCF"] as const;
+export const VOLUME_UNITS = ["L", "gal", "ft³", "m³", "CCF"] as const;
 
 export interface StatisticsUnitConfiguration {
   energy?: "Wh" | "kWh" | "MWh" | "GJ";
@@ -212,14 +211,7 @@ export const fetchStatistic = (
               : period.fixed_period.end,
         }
       : undefined,
-    calendar: period.calendar
-      ? {
-          ...(period.calendar.period === "week"
-            ? { first_weekday: firstWeekday(hass.locale).substring(0, 3) }
-            : {}),
-          ...period.calendar,
-        }
-      : undefined,
+    calendar: period.calendar,
     rolling_window: period.rolling_window,
   });
 

src/dialogs/config-flow/show-dialog-config-flow.ts

@@ -256,13 +256,6 @@ export const showConfigFlowDialog = (
       );
     },
 
-    renderMenuOptionDescription(hass, step, option) {
-      return hass.localize(
-        `component.${step.translation_domain || step.handler}.config.step.${step.step_id}.menu_option_descriptions.${option}`,
-        step.description_placeholders
-      );
-    },
-
     renderLoadingDescription(hass, reason, handler, step) {
       if (reason !== "loading_flow" && reason !== "loading_step") {
         return "";

src/dialogs/config-flow/show-dialog-data-entry-flow.ts

@@ -137,12 +137,6 @@ export interface FlowConfig {
     option: string
   ): string;
 
-  renderMenuOptionDescription(
-    hass: HomeAssistant,
-    step: DataEntryFlowStepMenu,
-    option: string
-  ): string;
-
   renderLoadingDescription(
     hass: HomeAssistant,
     loadingReason: LoadingReason,

src/dialogs/config-flow/show-dialog-options-flow.ts

@@ -225,13 +225,6 @@ export const showOptionsFlowDialog = (
         );
       },
 
-      renderMenuOptionDescription(hass, step, option) {
-        return hass.localize(
-          `component.${step.translation_domain || configEntry.domain}.options.step.${step.step_id}.menu_option_descriptions.${option}`,
-          step.description_placeholders
-        );
-      },
-
       renderLoadingDescription(hass, reason) {
         return (
           hass.localize(`component.${configEntry.domain}.options.loading`) ||

src/dialogs/config-flow/show-dialog-sub-config-flow.ts

@@ -252,13 +252,6 @@ export const showSubConfigFlowDialog = (
       );
     },
 
-    renderMenuOptionDescription(hass, step, option) {
-      return hass.localize(
-        `component.${step.translation_domain || configEntry.domain}.config_subentries.${flowType}.step.${step.step_id}.menu_option_descriptions.${option}`,
-        step.description_placeholders
-      );
-    },
-
     renderLoadingDescription(hass, reason, handler, step) {
       if (reason !== "loading_flow" && reason !== "loading_step") {
         return "";

src/dialogs/config-flow/step-flow-menu.ts

@@ -1,5 +1,5 @@
-import type { PropertyValues, TemplateResult } from "lit";
-import { css, html, LitElement, nothing } from "lit";
+import type { TemplateResult } from "lit";
+import { css, html, LitElement } from "lit";
 import { customElement, property } from "lit/decorators";
 import { fireEvent } from "../../common/dom/fire_event";
 import "../../components/ha-icon-next";
@@ -8,7 +8,6 @@ import type { DataEntryFlowStepMenu } from "../../data/data_entry_flow";
 import type { HomeAssistant } from "../../types";
 import type { FlowConfig } from "./show-dialog-data-entry-flow";
 import { configFlowContentStyles } from "./styles";
-import { stringCompare } from "../../common/string/compare";
 
 @customElement("step-flow-menu")
 class StepFlowMenu extends LitElement {
@@ -18,18 +17,9 @@ class StepFlowMenu extends LitElement {
 
   @property({ attribute: false }) public step!: DataEntryFlowStepMenu;
 
-  protected shouldUpdate(changedProps: PropertyValues): boolean {
-    return (
-      changedProps.size > 1 ||
-      !changedProps.has("hass") ||
-      this.hass.localize !== changedProps.get("hass")?.localize
-    );
-  }
-
   protected render(): TemplateResult {
     let options: string[];
     let translations: Record<string, string>;
-    let optionDescriptions: Record<string, string> = {};
 
     if (Array.isArray(this.step.menu_options)) {
       options = this.step.menu_options;
@@ -40,36 +30,10 @@ class StepFlowMenu extends LitElement {
           this.step,
           option
         );
-        optionDescriptions[option] =
-          this.flowConfig.renderMenuOptionDescription(
-            this.hass,
-            this.step,
-            option
-          );
       }
     } else {
       options = Object.keys(this.step.menu_options);
       translations = this.step.menu_options;
-      optionDescriptions = Object.fromEntries(
-        options.map((key) => [
-          key,
-          this.flowConfig.renderMenuOptionDescription(
-            this.hass,
-            this.step,
-            key
-          ),
-        ])
-      );
-    }
-
-    if (this.step.sort) {
-      options = options.sort((a, b) =>
-        stringCompare(
-          translations[a]!,
-          translations[b]!,
-          this.hass.locale.language
-        )
-      );
     }
 
     const description = this.flowConfig.renderMenuDescription(
@@ -82,18 +46,8 @@ class StepFlowMenu extends LitElement {
       <div class="options">
         ${options.map(
           (option) => html`
-            <ha-list-item
-              hasMeta
-              .step=${option}
-              @click=${this._handleStep}
-              ?twoline=${optionDescriptions[option]}
-            >
+            <ha-list-item hasMeta .step=${option} @click=${this._handleStep}>
               <span>${translations[option]}</span>
-              ${optionDescriptions[option]
-                ? html`<span slot="secondary">
-                    ${optionDescriptions[option]}
-                  </span>`
-                : nothing}
               <ha-icon-next slot="meta"></ha-icon-next>
             </ha-list-item>
           `
@@ -119,10 +73,11 @@ class StepFlowMenu extends LitElement {
     css`
       .options {
         margin-top: 20px;
-        margin-bottom: 16px;
+        margin-bottom: 8px;
       }
       .content {
         padding-bottom: 16px;
+        border-bottom: 1px solid var(--divider-color);
       }
       .content + .options {
         margin-top: 8px;

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

@@ -6,9 +6,7 @@ import memoizeOne from "memoize-one";
 import { formatDateWeekdayShort } from "../../../common/datetime/format_date";
 import { formatTime } from "../../../common/datetime/format_time";
 import { formatNumber } from "../../../common/number/format_number";
-import "../../../components/ha-alert";
 import "../../../components/ha-relative-time";
-import "../../../components/ha-spinner";
 import "../../../components/ha-state-icon";
 import "../../../components/ha-svg-icon";
 import "../../../components/ha-tooltip";
@@ -294,101 +292,106 @@ class MoreInfoWeather extends LitElement {
             </div>
           `
         : nothing}
-
-      <div class="section">
-        ${this.hass.localize("ui.card.weather.forecast")}:
-      </div>
-      ${supportedForecasts?.length > 1
-        ? html`<sl-tab-group @sl-tab-show=${this._handleForecastTypeChanged}>
-            ${supportedForecasts.map(
-              (forecastType) =>
-                html`<sl-tab
-                  slot="nav"
-                  .panel=${forecastType}
-                  .active=${this._forecastType === forecastType}
+      ${forecast
+        ? html`
+            <div class="section">
+              ${this.hass.localize("ui.card.weather.forecast")}:
+            </div>
+            ${supportedForecasts.length > 1
+              ? html`<sl-tab-group
+                  @sl-tab-show=${this._handleForecastTypeChanged}
                 >
-                  ${this.hass!.localize(`ui.card.weather.${forecastType}`)}
-                </sl-tab>`
-            )}
-          </sl-tab-group>`
-        : nothing}
-      <div class="forecast">
-        ${forecast?.length
-          ? forecast.map((item) =>
-              this._showValue(item.templow) || this._showValue(item.temperature)
-                ? html`
-                    <div>
+                  ${supportedForecasts.map(
+                    (forecastType) =>
+                      html`<sl-tab
+                        slot="nav"
+                        .panel=${forecastType}
+                        .active=${this._forecastType === forecastType}
+                      >
+                        ${this.hass!.localize(
+                          `ui.card.weather.${forecastType}`
+                        )}
+                      </sl-tab>`
+                  )}
+                </sl-tab-group>`
+              : nothing}
+            <div class="forecast">
+              ${forecast.map((item) =>
+                this._showValue(item.templow) ||
+                this._showValue(item.temperature)
+                  ? html`
                       <div>
-                        ${dayNight
-                          ? html`
-                              ${formatDateWeekdayShort(
-                                new Date(item.datetime),
-                                this.hass!.locale,
-                                this.hass!.config
-                              )}
-                              <div class="daynight">
-                                ${item.is_daytime !== false
-                                  ? this.hass!.localize("ui.card.weather.day")
-                                  : this.hass!.localize(
-                                      "ui.card.weather.night"
-                                    )}<br />
-                              </div>
-                            `
-                          : hourly
+                        <div>
+                          ${dayNight
                             ? html`
-                                ${formatTime(
-                                  new Date(item.datetime),
-                                  this.hass!.locale,
-                                  this.hass!.config
-                                )}
-                              `
-                            : html`
                                 ${formatDateWeekdayShort(
                                   new Date(item.datetime),
                                   this.hass!.locale,
                                   this.hass!.config
                                 )}
-                              `}
-                      </div>
-                      ${this._showValue(item.condition)
-                        ? html`
-                            <div class="forecast-image-icon">
-                              ${getWeatherStateIcon(
-                                item.condition!,
-                                this,
-                                !(
-                                  item.is_daytime ||
-                                  item.is_daytime === undefined
-                                )
-                              )}
-                            </div>
-                          `
-                        : nothing}
-                      <div class="temp">
-                        ${this._showValue(item.temperature)
-                          ? html`${formatNumber(
-                              item.temperature,
-                              this.hass!.locale
-                            )}°`
-                          : "—"}
-                      </div>
-                      <div class="templow">
-                        ${this._showValue(item.templow)
-                          ? html`${formatNumber(
-                              item.templow!,
-                              this.hass!.locale
-                            )}°`
-                          : hourly
-                            ? nothing
+                                <div class="daynight">
+                                  ${item.is_daytime !== false
+                                    ? this.hass!.localize("ui.card.weather.day")
+                                    : this.hass!.localize(
+                                        "ui.card.weather.night"
+                                      )}<br />
+                                </div>
+                              `
+                            : hourly
+                              ? html`
+                                  ${formatTime(
+                                    new Date(item.datetime),
+                                    this.hass!.locale,
+                                    this.hass!.config
+                                  )}
+                                `
+                              : html`
+                                  ${formatDateWeekdayShort(
+                                    new Date(item.datetime),
+                                    this.hass!.locale,
+                                    this.hass!.config
+                                  )}
+                                `}
+                        </div>
+                        ${this._showValue(item.condition)
+                          ? html`
+                              <div class="forecast-image-icon">
+                                ${getWeatherStateIcon(
+                                  item.condition!,
+                                  this,
+                                  !(
+                                    item.is_daytime ||
+                                    item.is_daytime === undefined
+                                  )
+                                )}
+                              </div>
+                            `
+                          : nothing}
+                        <div class="temp">
+                          ${this._showValue(item.temperature)
+                            ? html`${formatNumber(
+                                item.temperature,
+                                this.hass!.locale
+                              )}°`
                             : "—"}
+                        </div>
+                        <div class="templow">
+                          ${this._showValue(item.templow)
+                            ? html`${formatNumber(
+                                item.templow!,
+                                this.hass!.locale
+                              )}°`
+                            : hourly
+                              ? nothing
+                              : "—"}
+                        </div>
                       </div>
-                    </div>
-                  `
-                : nothing
-            )
-          : html`<ha-spinner size="medium"></ha-spinner>`}
-      </div>
-
+                    `
+                  : nothing
+              )}
+            </div>
+          `
+        : nothing}
       ${this.stateObj.attributes.attribution
         ? html`
             <div class="attribution">
@@ -586,10 +589,6 @@ class MoreInfoWeather extends LitElement {
         .forecast-icon {
           --mdc-icon-size: 40px;
         }
-
-        .forecast ha-spinner {
-          height: 120px;
-        }
       `,
     ];
   }

src/dialogs/shortcuts/dialog-shortcuts.ts

@@ -1,148 +1,121 @@
-import { mdiAppleKeyboardCommand } from "@mdi/js";
 import { css, html, LitElement, nothing } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import { fireEvent } from "../../common/dom/fire_event";
-import type { LocalizeKeys } from "../../common/translations/localize";
-import "../../components/ha-alert";
+import "../../components/ha-button";
 import { createCloseHeading } from "../../components/ha-dialog";
-import "../../components/ha-svg-icon";
-import { haStyleDialog } from "../../resources/styles";
 import type { HomeAssistant } from "../../types";
-import { isMac } from "../../util/is_mac";
+import { haStyleDialog } from "../../resources/styles";
+import "../../components/ha-alert";
+import "../../components/chips/ha-assist-chip";
+import type { LocalizeKeys } from "../../common/translations/localize";
 
 interface Text {
-  textTranslationKey: LocalizeKeys;
+  type: "text";
+  key: LocalizeKeys;
 }
 
-interface LocalizedShortcut {
-  shortcutTranslationKey: LocalizeKeys;
-}
-
-type ShortcutString = string | LocalizedShortcut;
+type ShortcutString = string | { key: LocalizeKeys };
 
 interface Shortcut {
+  type: "shortcut";
   shortcut: ShortcutString[];
-  descriptionTranslationKey: LocalizeKeys;
+  key: LocalizeKeys;
 }
 
 interface Section {
-  titleTranslationKey: LocalizeKeys;
+  key: LocalizeKeys;
   items: (Text | Shortcut)[];
 }
 
-const CTRL_CMD = "__CTRL_CMD__";
-
 const _SHORTCUTS: Section[] = [
   {
-    titleTranslationKey: "ui.dialogs.shortcuts.searching.title",
+    key: "ui.dialogs.shortcuts.searching.title",
     items: [
+      { type: "text", key: "ui.dialogs.shortcuts.searching.on_any_page" },
       {
-        textTranslationKey: "ui.dialogs.shortcuts.searching.on_any_page",
-      },
-      {
+        type: "shortcut",
         shortcut: ["C"],
-        descriptionTranslationKey:
-          "ui.dialogs.shortcuts.searching.search_command",
+        key: "ui.dialogs.shortcuts.searching.search_command",
       },
       {
+        type: "shortcut",
         shortcut: ["E"],
-        descriptionTranslationKey:
-          "ui.dialogs.shortcuts.searching.search_entities",
+        key: "ui.dialogs.shortcuts.searching.search_entities",
       },
       {
+        type: "shortcut",
         shortcut: ["D"],
-        descriptionTranslationKey:
-          "ui.dialogs.shortcuts.searching.search_devices",
+        key: "ui.dialogs.shortcuts.searching.search_devices",
       },
       {
-        textTranslationKey:
-          "ui.dialogs.shortcuts.searching.on_pages_with_tables",
+        type: "text",
+        key: "ui.dialogs.shortcuts.searching.on_pages_with_tables",
       },
       {
-        shortcut: [CTRL_CMD, "F"],
-        descriptionTranslationKey:
-          "ui.dialogs.shortcuts.searching.search_in_table",
+        type: "shortcut",
+        shortcut: [{ key: "ui.dialogs.shortcuts.shortcuts.ctrl_cmd" }, "F"],
+        key: "ui.dialogs.shortcuts.searching.search_in_table",
       },
     ],
   },
   {
-    titleTranslationKey: "ui.dialogs.shortcuts.assist.title",
+    key: "ui.dialogs.shortcuts.assist.title",
     items: [
       {
+        type: "shortcut",
         shortcut: ["A"],
-        descriptionTranslationKey: "ui.dialogs.shortcuts.assist.open_assist",
+        key: "ui.dialogs.shortcuts.assist.open_assist",
       },
     ],
   },
   {
-    titleTranslationKey: "ui.dialogs.shortcuts.automation_script.title",
+    key: "ui.dialogs.shortcuts.automation_script.title",
     items: [
       {
-        shortcut: [CTRL_CMD, "C"],
-        descriptionTranslationKey:
-          "ui.dialogs.shortcuts.automation_script.copy",
+        type: "shortcut",
+        shortcut: [{ key: "ui.dialogs.shortcuts.shortcuts.ctrl_cmd" }, "V"],
+        key: "ui.dialogs.shortcuts.automation_script.paste",
       },
       {
-        shortcut: [CTRL_CMD, "X"],
-        descriptionTranslationKey: "ui.dialogs.shortcuts.automation_script.cut",
-      },
-      {
-        shortcut: [
-          CTRL_CMD,
-          { shortcutTranslationKey: "ui.dialogs.shortcuts.keys.del" },
-        ],
-        descriptionTranslationKey:
-          "ui.dialogs.shortcuts.automation_script.delete",
-      },
-      {
-        shortcut: [CTRL_CMD, "V"],
-        descriptionTranslationKey:
-          "ui.dialogs.shortcuts.automation_script.paste",
-      },
-      {
-        shortcut: [CTRL_CMD, "S"],
-        descriptionTranslationKey:
-          "ui.dialogs.shortcuts.automation_script.save",
+        type: "shortcut",
+        shortcut: [{ key: "ui.dialogs.shortcuts.shortcuts.ctrl_cmd" }, "S"],
+        key: "ui.dialogs.shortcuts.automation_script.save",
       },
     ],
   },
   {
-    titleTranslationKey: "ui.dialogs.shortcuts.charts.title",
+    key: "ui.dialogs.shortcuts.charts.title",
     items: [
       {
+        type: "shortcut",
         shortcut: [
-          CTRL_CMD,
-          { shortcutTranslationKey: "ui.dialogs.shortcuts.shortcuts.drag" },
+          { key: "ui.dialogs.shortcuts.shortcuts.ctrl_cmd" },
+          { key: "ui.dialogs.shortcuts.shortcuts.drag" },
         ],
-        descriptionTranslationKey: "ui.dialogs.shortcuts.charts.drag_to_zoom",
+        key: "ui.dialogs.shortcuts.charts.drag_to_zoom",
       },
       {
+        type: "shortcut",
         shortcut: [
-          CTRL_CMD,
-          {
-            shortcutTranslationKey:
-              "ui.dialogs.shortcuts.shortcuts.scroll_wheel",
-          },
+          { key: "ui.dialogs.shortcuts.shortcuts.ctrl_cmd" },
+          { key: "ui.dialogs.shortcuts.shortcuts.scroll_wheel" },
         ],
-        descriptionTranslationKey: "ui.dialogs.shortcuts.charts.scroll_to_zoom",
+        key: "ui.dialogs.shortcuts.charts.scroll_to_zoom",
       },
       {
-        shortcut: [
-          {
-            shortcutTranslationKey:
-              "ui.dialogs.shortcuts.shortcuts.double_click",
-          },
-        ],
-        descriptionTranslationKey: "ui.dialogs.shortcuts.charts.double_click",
+        type: "shortcut",
+        shortcut: [{ key: "ui.dialogs.shortcuts.shortcuts.double_click" }],
+        key: "ui.dialogs.shortcuts.charts.double_click",
       },
     ],
   },
   {
-    titleTranslationKey: "ui.dialogs.shortcuts.other.title",
+    key: "ui.dialogs.shortcuts.other.title",
     items: [
       {
+        type: "shortcut",
         shortcut: ["M"],
-        descriptionTranslationKey: "ui.dialogs.shortcuts.other.my_link",
+        key: "ui.dialogs.shortcuts.other.my_link",
       },
     ],
   },
@@ -164,28 +137,17 @@ class DialogShortcuts extends LitElement {
   }
 
   private _renderShortcut(
-    shortcutKeys: ShortcutString[],
-    descriptionKey: LocalizeKeys
+    shortcuts: ShortcutString[],
+    translationKey: LocalizeKeys
   ) {
+    const keys = shortcuts.map((shortcut) =>
+      typeof shortcut === "string" ? shortcut : this.hass.localize(shortcut.key)
+    );
+
     return html`
       <div class="shortcut">
-        ${shortcutKeys.map(
-          (shortcutKey) =>
-            html`<span
-              >${shortcutKey === CTRL_CMD
-                ? isMac
-                  ? html`<ha-svg-icon
-                      .path=${mdiAppleKeyboardCommand}
-                    ></ha-svg-icon>`
-                  : this.hass.localize("ui.panel.config.automation.editor.ctrl")
-                : typeof shortcutKey === "string"
-                  ? shortcutKey
-                  : this.hass.localize(
-                      shortcutKey.shortcutTranslationKey
-                    )}</span
-            >`
-        )}
-        ${this.hass.localize(descriptionKey)}
+        ${keys.map((key) => html` <span>${key.toUpperCase()}</span>`)}
+        ${this.hass.localize(translationKey)}
       </div>
     `;
   }
@@ -209,18 +171,16 @@ class DialogShortcuts extends LitElement {
         <div class="content">
           ${_SHORTCUTS.map(
             (section) => html`
-              <h3>${this.hass.localize(section.titleTranslationKey)}</h3>
+              <h3>${this.hass.localize(section.key)}</h3>
               <div class="items">
                 ${section.items.map((item) => {
-                  if ("shortcut" in item) {
-                    return this._renderShortcut(
-                      (item as Shortcut).shortcut,
-                      (item as Shortcut).descriptionTranslationKey
-                    );
+                  if (item.type === "text") {
+                    return html`<p>${this.hass.localize(item.key)}</p>`;
                   }
-                  return html`<p>
-                    ${this.hass.localize((item as Text).textTranslationKey)}
-                  </p>`;
+                  if (item.type === "shortcut") {
+                    return this._renderShortcut(item.shortcut, item.key);
+                  }
+                  return nothing;
                 })}
               </div>
             `
@@ -272,10 +232,6 @@ class DialogShortcuts extends LitElement {
       .items p {
         margin-bottom: 8px;
       }
-
-      ha-svg-icon {
-        width: 12px;
-      }
     `,
   ];
 }

src/html/authorize.html.template

@@ -35,7 +35,6 @@
         align-items: center;
         justify-content: center;
         margin-bottom: 32px;
-        padding-top: var(--safe-area-inset-top);
       }
 
       .header img {

src/html/index.html.template

@@ -44,7 +44,7 @@
       }
       #ha-launch-screen .ha-launch-screen-spacer-top {
         flex: 1;
-        margin-top: calc( 2 * max(var(--safe-area-inset-top, 0px), 48px) + 46px );
+        margin-top: calc( 2 * max(var(--safe-area-inset-bottom, 0px), 48px) + 46px );
         padding-top: 48px;
       }
       #ha-launch-screen .ha-launch-screen-spacer-bottom {

src/html/onboarding.html.template

@@ -19,9 +19,8 @@
         height: auto;
         padding: 32px 0;
       }
-
       .content {
-        max-width: min(560px, calc(100vw - var(--safe-area-inset-right, 0px) - var(--safe-area-inset-left, 0px)));
+        max-width: 560px;
         margin: 0 auto;
         padding: 0 16px;
         box-sizing: content-box;
@@ -33,7 +32,6 @@
         justify-content: flex-start;
         margin-bottom: 32px;
         margin-left: 32px;
-        padding-top: var(--safe-area-inset-top);
       }
 
       .header img {

src/layouts/home-assistant-main.ts

@@ -146,8 +146,6 @@ export class HomeAssistantMain extends LitElement {
       -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
       --mdc-drawer-width: 56px;
       --mdc-top-app-bar-width: calc(100% - var(--mdc-drawer-width));
-      --safe-area-content-inset-left: 0px;
-      --safe-area-content-inset-right: var(--safe-area-inset-right);
     }
     :host([expanded]) {
       --mdc-drawer-width: calc(256px + var(--safe-area-inset-left));
@@ -155,7 +153,6 @@ export class HomeAssistantMain extends LitElement {
     :host([modal]) {
       --mdc-drawer-width: unset;
       --mdc-top-app-bar-width: unset;
-      --safe-area-content-inset-left: var(--safe-area-inset-left);
     }
     partial-panel-resolver,
     ha-sidebar {

src/panels/config/automation/action/ha-automation-action-row.ts

@@ -89,6 +89,7 @@ import "./types/ha-automation-action-set_conversation_response";
 import "./types/ha-automation-action-stop";
 import "./types/ha-automation-action-wait_for_trigger";
 import "./types/ha-automation-action-wait_template";
+import { copyToClipboard } from "../../../../common/util/copy-clipboard";
 
 export const getAutomationActionType = memoizeOne(
   (action: Action | undefined) => {
@@ -507,6 +508,7 @@ export default class HaAutomationActionRow extends LitElement {
       ...this._clipboard,
       action: deepClone(this.action),
     };
+    copyToClipboard(JSON.stringify(this.action));
   }
 
   private _onDisable = () => {
@@ -692,7 +694,8 @@ export default class HaAutomationActionRow extends LitElement {
     ev?.stopPropagation();
 
     if (this._selected) {
-      fireEvent(this, "request-close-sidebar");
+      this._selected = false;
+      fireEvent(this, "close-sidebar");
       return;
     }
     this.openSidebar();
@@ -736,12 +739,12 @@ export default class HaAutomationActionRow extends LitElement {
     this._collapsed = false;
 
     if (this.narrow) {
-      window.setTimeout(() => {
+      requestAnimationFrame(() => {
         this.scrollIntoView({
           block: "start",
           behavior: "smooth",
         });
-      }, 180); // duration of transition of added padding for bottom sheet
+      });
     }
   }
 

src/panels/config/automation/condition/ha-automation-condition-row.ts

@@ -69,6 +69,7 @@ import "./types/ha-automation-condition-template";
 import "./types/ha-automation-condition-time";
 import "./types/ha-automation-condition-trigger";
 import "./types/ha-automation-condition-zone";
+import { copyToClipboard } from "../../../../common/util/copy-clipboard";
 
 export interface ConditionElement extends LitElement {
   condition: Condition;
@@ -440,6 +441,7 @@ export default class HaAutomationConditionRow extends LitElement {
       ...this._clipboard,
       condition: deepClone(this.condition),
     };
+    copyToClipboard(JSON.stringify(this.condition));
   }
 
   private _onDisable = () => {
@@ -667,7 +669,8 @@ export default class HaAutomationConditionRow extends LitElement {
     ev?.stopPropagation();
 
     if (this._selected) {
-      fireEvent(this, "request-close-sidebar");
+      this._selected = false;
+      fireEvent(this, "close-sidebar");
       return;
     }
     this.openSidebar();
@@ -707,12 +710,12 @@ export default class HaAutomationConditionRow extends LitElement {
     this._collapsed = false;
 
     if (this.narrow) {
-      window.setTimeout(() => {
+      requestAnimationFrame(() => {
         this.scrollIntoView({
           block: "start",
           behavior: "smooth",
         });
-      }, 180); // duration of transition of added padding for bottom sheet
+      });
     }
   }
 

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

@@ -16,6 +16,8 @@ import {
   mdiStopCircleOutline,
   mdiTag,
   mdiTransitConnection,
+  mdiUnfoldLessHorizontal,
+  mdiUnfoldMoreHorizontal,
 } from "@mdi/js";
 import type { UnsubscribeFunc } from "home-assistant-js-websocket";
 import type { CSSResultGroup, PropertyValues, TemplateResult } from "lit";
@@ -369,6 +371,30 @@ export class HaAutomationEditor extends PreventUnsavedMixin(
             <ha-svg-icon slot="graphic" .path=${mdiPlaylistEdit}></ha-svg-icon>
           </ha-list-item>
 
+          ${!useBlueprint
+            ? html`
+                <ha-list-item graphic="icon" @click=${this._collapseAll}>
+                  <ha-svg-icon
+                    slot="graphic"
+                    .path=${mdiUnfoldLessHorizontal}
+                  ></ha-svg-icon>
+                  ${this.hass.localize(
+                    "ui.panel.config.automation.editor.collapse_all"
+                  )}
+                </ha-list-item>
+
+                <ha-list-item graphic="icon" @click=${this._expandAll}>
+                  <ha-svg-icon
+                    slot="graphic"
+                    .path=${mdiUnfoldMoreHorizontal}
+                  ></ha-svg-icon>
+                  ${this.hass.localize(
+                    "ui.panel.config.automation.editor.expand_all"
+                  )}
+                </ha-list-item>
+              `
+            : nothing}
+
           <li divider role="separator"></li>
 
           <ha-list-item
@@ -1115,7 +1141,6 @@ export class HaAutomationEditor extends PreventUnsavedMixin(
       c: () => this._copySelectedRow(),
       x: () => this._cutSelectedRow(),
       Delete: () => this._deleteSelectedRow(),
-      Backspace: () => this._deleteSelectedRow(),
     };
   }
 
@@ -1127,12 +1152,10 @@ export class HaAutomationEditor extends PreventUnsavedMixin(
     return this._confirmUnsavedChanged();
   }
 
-  // @ts-ignore
   private _collapseAll() {
     this._manualEditor?.collapseAll();
   }
 
-  // @ts-ignore
   private _expandAll() {
     this._manualEditor?.expandAll();
   }

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

@@ -292,7 +292,7 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) {
           extraTemplate: (automation) =>
             automation.labels.length
               ? html`<ha-data-table-labels
-                  @label-clicked=${narrow ? undefined : this._labelClicked}
+                  @label-clicked=${this._labelClicked}
                   .labels=${automation.labels}
                 ></ha-data-table-labels>`
               : nothing,

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

@@ -55,7 +55,7 @@ export default class HaAutomationSidebar extends LitElement {
           .yamlMode=${this._yamlMode}
           .sidebarKey=${this.sidebarKey}
           @toggle-yaml-mode=${this._toggleYamlMode}
-          @close-sidebar=${this.triggerCloseSidebar}
+          @close-sidebar=${this._handleCloseSidebar}
         ></ha-automation-sidebar-trigger>
       `;
     }
@@ -71,7 +71,7 @@ export default class HaAutomationSidebar extends LitElement {
           .yamlMode=${this._yamlMode}
           .sidebarKey=${this.sidebarKey}
           @toggle-yaml-mode=${this._toggleYamlMode}
-          @close-sidebar=${this.triggerCloseSidebar}
+          @close-sidebar=${this._handleCloseSidebar}
         ></ha-automation-sidebar-condition>
       `;
     }
@@ -87,7 +87,7 @@ export default class HaAutomationSidebar extends LitElement {
           .yamlMode=${this._yamlMode}
           .sidebarKey=${this.sidebarKey}
           @toggle-yaml-mode=${this._toggleYamlMode}
-          @close-sidebar=${this.triggerCloseSidebar}
+          @close-sidebar=${this._handleCloseSidebar}
         ></ha-automation-sidebar-action>
       `;
     }
@@ -100,7 +100,7 @@ export default class HaAutomationSidebar extends LitElement {
           .isWide=${this.isWide}
           .narrow=${this.narrow}
           .disabled=${this.disabled}
-          @close-sidebar=${this.triggerCloseSidebar}
+          @close-sidebar=${this._handleCloseSidebar}
         ></ha-automation-sidebar-option>
       `;
     }
@@ -116,7 +116,7 @@ export default class HaAutomationSidebar extends LitElement {
           .yamlMode=${this._yamlMode}
           .sidebarKey=${this.sidebarKey}
           @toggle-yaml-mode=${this._toggleYamlMode}
-          @close-sidebar=${this.triggerCloseSidebar}
+          @close-sidebar=${this._handleCloseSidebar}
         ></ha-automation-sidebar-script-field-selector>
       `;
     }
@@ -132,7 +132,7 @@ export default class HaAutomationSidebar extends LitElement {
           .yamlMode=${this._yamlMode}
           .sidebarKey=${this.sidebarKey}
           @toggle-yaml-mode=${this._toggleYamlMode}
-          @close-sidebar=${this.triggerCloseSidebar}
+          @close-sidebar=${this._handleCloseSidebar}
         ></ha-automation-sidebar-script-field>
       `;
     }
@@ -188,8 +188,8 @@ export default class HaAutomationSidebar extends LitElement {
     return undefined;
   }
 
-  public triggerCloseSidebar(ev?: CustomEvent) {
-    ev?.stopPropagation();
+  private _handleCloseSidebar(ev: CustomEvent) {
+    ev.stopPropagation();
     if (this.narrow) {
       this._bottomSheetElement?.closeSheet();
       return;

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

@@ -166,7 +166,7 @@ export class HaManualAutomationEditor extends LitElement {
         .disabled=${this.disabled || this.saving}
         .narrow=${this.narrow}
         @open-sidebar=${this._openSidebar}
-        @request-close-sidebar=${this._triggerCloseSidebar}
+        @request-close-sidebar=${this._closeSidebar}
         @close-sidebar=${this._handleCloseSidebar}
         root
         sidebar
@@ -213,7 +213,7 @@ export class HaManualAutomationEditor extends LitElement {
         .disabled=${this.disabled || this.saving}
         .narrow=${this.narrow}
         @open-sidebar=${this._openSidebar}
-        @request-close-sidebar=${this._triggerCloseSidebar}
+        @request-close-sidebar=${this._closeSidebar}
         @close-sidebar=${this._handleCloseSidebar}
         root
         sidebar
@@ -255,7 +255,7 @@ export class HaManualAutomationEditor extends LitElement {
         .highlightedActions=${this._pastedConfig?.actions || []}
         @value-changed=${this._actionChanged}
         @open-sidebar=${this._openSidebar}
-        @request-close-sidebar=${this._triggerCloseSidebar}
+        @request-close-sidebar=${this._closeSidebar}
         @close-sidebar=${this._handleCloseSidebar}
         .hass=${this.hass}
         .narrow=${this.narrow}
@@ -274,11 +274,7 @@ export class HaManualAutomationEditor extends LitElement {
         })}
       >
         <div class="content-wrapper">
-          <div
-            class="content ${this._sidebarConfig && this.narrow
-              ? "has-bottom-sheet"
-              : ""}"
-          >
+          <div class="content">
             <slot name="alerts"></slot>
             ${this._renderContent()}
           </div>
@@ -351,12 +347,8 @@ export class HaManualAutomationEditor extends LitElement {
     };
   }
 
-  private _triggerCloseSidebar() {
+  private _closeSidebar() {
     if (this._sidebarConfig) {
-      if (this._sidebarElement) {
-        this._sidebarElement.triggerCloseSidebar();
-        return;
-      }
       this._sidebarConfig?.close();
     }
   }
@@ -393,7 +385,7 @@ export class HaManualAutomationEditor extends LitElement {
   }
 
   private _saveAutomation() {
-    this._triggerCloseSidebar();
+    this._closeSidebar();
     fireEvent(this, "save-automation");
   }
 
@@ -498,6 +490,14 @@ export class HaManualAutomationEditor extends LitElement {
     if (normalized) {
       ev.preventDefault();
 
+      if (
+        Object.keys(normalized).length === 1 &&
+        ensureArray(normalized[Object.keys(normalized)[0]]).length === 1
+      ) {
+        this._appendToExistingConfig(normalized);
+        return;
+      }
+
       if (
         this.dirty ||
         ensureArray(this.config.triggers)?.length ||

src/panels/config/automation/option/ha-automation-option-row.ts

@@ -381,7 +381,8 @@ export default class HaAutomationOptionRow extends LitElement {
     ev?.stopPropagation();
 
     if (this._selected) {
-      fireEvent(this, "request-close-sidebar");
+      this._selected = false;
+      fireEvent(this, "close-sidebar");
       return;
     }
     this.openSidebar();
@@ -407,12 +408,12 @@ export default class HaAutomationOptionRow extends LitElement {
     this._collapsed = false;
 
     if (this.narrow) {
-      window.setTimeout(() => {
+      requestAnimationFrame(() => {
         this.scrollIntoView({
           block: "start",
           behavior: "smooth",
         });
-      }, 180); // duration of transition of added padding for bottom sheet
+      });
     }
   }
 

src/panels/config/automation/sidebar/ha-automation-sidebar-card.ts

@@ -171,6 +171,7 @@ export default class HaAutomationSidebarCard extends LitElement {
       transition: box-shadow 180ms ease-in-out;
       border-bottom-left-radius: 0;
       border-bottom-right-radius: 0;
+      z-index: 6;
       position: relative;
       background-color: var(
         --ha-dialog-surface-background,
@@ -179,7 +180,7 @@ export default class HaAutomationSidebarCard extends LitElement {
     }
 
     ha-dialog-header.scrolled {
-      box-shadow: var(--bar-box-shadow);
+      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
     }
 
     .fade {
@@ -193,14 +194,12 @@ export default class HaAutomationSidebarCard extends LitElement {
     }
 
     .fade.scrollable {
-      box-shadow: var(--bar-box-shadow);
-      transform: rotate(180deg);
+      box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.16);
     }
 
     .card-content {
       max-height: calc(100% - 80px);
       overflow: auto;
-      margin-top: 0;
     }
 
     @media (min-width: 450px) and (min-height: 500px) {

src/panels/config/automation/sidebar/ha-automation-sidebar-condition.ts

@@ -65,10 +65,6 @@ export default class HaAutomationSidebarCondition extends LitElement {
         }
       }
     }
-    // Reset testing state when condition changes
-    if (changedProperties.has("sidebarKey")) {
-      this._testing = false;
-    }
   }
 
   protected render() {
@@ -287,23 +283,20 @@ export default class HaAutomationSidebarCondition extends LitElement {
               sidebar
             ></ha-automation-condition-editor>`
           )}
-      <div class="testing-wrapper">
-        <div
-          class="testing ${classMap({
-            active: this._testing,
-            pass: this._testingResult === true,
-            error: this._testingResult === false,
-            narrow: this.narrow,
-          })}"
-        >
-          ${this._testingResult
-            ? this.hass.localize(
-                "ui.panel.config.automation.editor.conditions.testing_pass"
-              )
-            : this.hass.localize(
-                "ui.panel.config.automation.editor.conditions.testing_error"
-              )}
-        </div>
+      <div
+        class="testing ${classMap({
+          active: this._testing,
+          pass: this._testingResult === true,
+          error: this._testingResult === false,
+        })}"
+      >
+        ${this._testingResult
+          ? this.hass.localize(
+              "ui.panel.config.automation.editor.conditions.testing_pass"
+            )
+          : this.hass.localize(
+              "ui.panel.config.automation.editor.conditions.testing_error"
+            )}
       </div>
     </ha-automation-sidebar-card>`;
   }
@@ -403,13 +396,21 @@ export default class HaAutomationSidebarCondition extends LitElement {
       ha-automation-sidebar-card {
         position: relative;
       }
-      .testing-wrapper {
+      .testing {
         position: absolute;
+        z-index: 6;
         top: 0px;
         right: 0px;
         left: 0px;
-        margin: -1px;
+        text-transform: uppercase;
+        font-size: var(--ha-font-size-m);
+        font-weight: var(--ha-font-weight-bold);
+        background-color: var(--divider-color, #e0e0e0);
+        color: var(--text-primary-color);
+        max-height: 0px;
         overflow: hidden;
+        transition: max-height 0.3s;
+        text-align: center;
         border-top-right-radius: var(
           --ha-card-border-radius,
           var(--ha-border-radius-lg)
@@ -418,33 +419,15 @@ export default class HaAutomationSidebarCondition extends LitElement {
           --ha-card-border-radius,
           var(--ha-border-radius-lg)
         );
-        pointer-events: none;
-        height: 100px;
-      }
-      .testing {
-        --testing-color: var(--divider-color, #e0e0e0);
-        text-transform: uppercase;
-        font-size: var(--ha-font-size-m);
-        font-weight: var(--ha-font-weight-bold);
-        background-color: var(--testing-color);
-        color: var(--text-primary-color);
-        max-height: 0px;
-        transition:
-          max-height 0.3s ease-in-out,
-          padding-top 0.3s ease-in-out;
-        text-align: center;
-      }
-      .testing.active.narrow {
-        padding-top: 16px;
       }
       .testing.active {
-        max-height: 100%;
+        max-height: 100px;
       }
       .testing.error {
-        --testing-color: var(--accent-color);
+        background-color: var(--accent-color);
       }
       .testing.pass {
-        --testing-color: var(--success-color);
+        background-color: var(--success-color);
       }
     `,
   ];

src/panels/config/automation/styles.ts

@@ -136,11 +136,6 @@ export const manualEditorStyles = css`
   .content {
     padding-top: 24px;
     padding-bottom: 72px;
-    transition: padding-bottom 180ms ease-in-out;
-  }
-
-  .content.has-bottom-sheet {
-    padding-bottom: calc(90vh - 72px);
   }
 
   ha-automation-sidebar {
@@ -189,7 +184,8 @@ export const automationRowsStyles = css`
     scroll-margin-top: 48px;
   }
   .handle {
-    padding: 4px;
+    margin: 4px;
+    padding: 8px;
     cursor: move; /* fallback if grab cursor is unsupported */
     cursor: grab;
     border-radius: var(--ha-border-radius-pill);
@@ -217,7 +213,7 @@ export const automationRowsStyles = css`
 export const sidebarEditorStyles = css`
   .sidebar-editor {
     display: block;
-    padding-top: 8px;
+    padding-top: 16px;
   }
   .description {
     padding-top: 16px;

src/panels/config/automation/trigger/ha-automation-trigger-row.ts

@@ -75,6 +75,7 @@ import "./types/ha-automation-trigger-time";
 import "./types/ha-automation-trigger-time_pattern";
 import "./types/ha-automation-trigger-webhook";
 import "./types/ha-automation-trigger-zone";
+import { copyToClipboard } from "../../../../common/util/copy-clipboard";
 
 export interface TriggerElement extends LitElement {
   trigger: Trigger;
@@ -481,7 +482,8 @@ export default class HaAutomationTriggerRow extends LitElement {
     ev?.stopPropagation();
 
     if (this._selected) {
-      fireEvent(this, "request-close-sidebar");
+      this._selected = false;
+      fireEvent(this, "close-sidebar");
       return;
     }
     this.openSidebar();
@@ -518,12 +520,12 @@ export default class HaAutomationTriggerRow extends LitElement {
     this._selected = true;
 
     if (this.narrow) {
-      window.setTimeout(() => {
+      requestAnimationFrame(() => {
         this.scrollIntoView({
           block: "start",
           behavior: "smooth",
         });
-      }, 180);
+      });
     }
   }
 
@@ -532,6 +534,7 @@ export default class HaAutomationTriggerRow extends LitElement {
       ...this._clipboard,
       trigger: this.trigger,
     };
+    copyToClipboard(JSON.stringify(this.trigger));
   }
 
   private _onDelete = () => {

src/panels/config/devices/ha-config-device-page.ts

@@ -773,11 +773,6 @@ export class HaConfigDevicePage extends LitElement {
                         appearance="plain"
                         target=${ifDefined(firstDeviceAction!.target)}
                         class=${ifDefined(firstDeviceAction!.classes)}
-                        .variant=${firstDeviceAction!.classes?.includes(
-                          "warning"
-                        )
-                          ? "danger"
-                          : "brand"}
                         .action=${firstDeviceAction!.action}
                         @click=${this._deviceActionClicked}
                       >

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

@@ -1,5 +1,5 @@
 import type { CSSResultGroup, TemplateResult } from "lit";
-import { css, html, LitElement, nothing } from "lit";
+import { css, html, LitElement } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import "../../../../../components/ha-card";
 import "../../../../../components/ha-code-editor";
@@ -11,22 +11,13 @@ import { showOptionsFlowDialog } from "../../../../../dialogs/config-flow/show-d
 import "../../../../../layouts/hass-subpage";
 import { haStyle } from "../../../../../resources/styles";
 import type { HomeAssistant } from "../../../../../types";
-import {
-  subscribeBluetoothConnectionAllocations,
-  subscribeBluetoothScannerState,
-  subscribeBluetoothScannersDetails,
-} from "../../../../../data/bluetooth";
-import type {
-  BluetoothAllocationsData,
-  BluetoothScannerState,
-  BluetoothScannersDetails,
-  HaScannerType,
-} from "../../../../../data/bluetooth";
+import { subscribeBluetoothConnectionAllocations } from "../../../../../data/bluetooth";
 import {
   getValueInPercentage,
   roundWithOneDecimal,
 } from "../../../../../util/calculate";
 import "../../../../../components/ha-metric";
+import type { BluetoothAllocationsData } from "../../../../../data/bluetooth";
 
 @customElement("bluetooth-config-dashboard")
 export class BluetoothConfigDashboard extends LitElement {
@@ -38,26 +29,16 @@ export class BluetoothConfigDashboard extends LitElement {
 
   @state() private _connectionAllocationsError?: string;
 
-  @state() private _scannerState?: BluetoothScannerState;
-
-  @state() private _scannerDetails?: BluetoothScannersDetails;
-
   private _configEntry = new URLSearchParams(window.location.search).get(
     "config_entry"
   );
 
   private _unsubConnectionAllocations?: (() => Promise<void>) | undefined;
 
-  private _unsubScannerState?: (() => Promise<void>) | undefined;
-
-  private _unsubScannerDetails?: (() => void) | undefined;
-
   public connectedCallback(): void {
     super.connectedCallback();
     if (this.hass) {
       this._subscribeBluetoothConnectionAllocations();
-      this._subscribeBluetoothScannerState();
-      this._subscribeScannerDetails();
     }
   }
 
@@ -80,45 +61,12 @@ export class BluetoothConfigDashboard extends LitElement {
     }
   }
 
-  private async _subscribeBluetoothScannerState(): Promise<void> {
-    if (this._unsubScannerState || !this._configEntry) {
-      return;
-    }
-    this._unsubScannerState = await subscribeBluetoothScannerState(
-      this.hass.connection,
-      (scannerState) => {
-        this._scannerState = scannerState;
-      },
-      this._configEntry
-    );
-  }
-
-  private _subscribeScannerDetails(): void {
-    if (this._unsubScannerDetails) {
-      return;
-    }
-    this._unsubScannerDetails = subscribeBluetoothScannersDetails(
-      this.hass.connection,
-      (details) => {
-        this._scannerDetails = details;
-      }
-    );
-  }
-
   public disconnectedCallback() {
     super.disconnectedCallback();
     if (this._unsubConnectionAllocations) {
       this._unsubConnectionAllocations();
       this._unsubConnectionAllocations = undefined;
     }
-    if (this._unsubScannerState) {
-      this._unsubScannerState();
-      this._unsubScannerState = undefined;
-    }
-    if (this._unsubScannerDetails) {
-      this._unsubScannerDetails();
-      this._unsubScannerDetails = undefined;
-    }
   }
 
   protected render(): TemplateResult {
@@ -130,7 +78,6 @@ export class BluetoothConfigDashboard extends LitElement {
               "ui.panel.config.bluetooth.settings_title"
             )}
           >
-            <div class="card-content">${this._renderScannerState()}</div>
             <div class="card-actions">
               <ha-button @click=${this._openOptionFlow}
                 >${this.hass.localize(
@@ -195,118 +142,6 @@ export class BluetoothConfigDashboard extends LitElement {
   private _getUsedAllocations = (used: number, total: number) =>
     roundWithOneDecimal(getValueInPercentage(used, 0, total));
 
-  private _renderScannerMismatchWarning(
-    scannerState: BluetoothScannerState,
-    scannerType: HaScannerType,
-    formatMode: (mode: string | null) => string
-  ) {
-    const instructions: string[] = [];
-
-    if (scannerType === "remote" || scannerType === "unknown") {
-      instructions.push(
-        this.hass.localize(
-          "ui.panel.config.bluetooth.scanner_mode_mismatch_remote"
-        )
-      );
-    }
-    if (scannerType === "usb" || scannerType === "unknown") {
-      instructions.push(
-        this.hass.localize(
-          "ui.panel.config.bluetooth.scanner_mode_mismatch_usb"
-        )
-      );
-    }
-    if (scannerType === "uart" || scannerType === "unknown") {
-      instructions.push(
-        this.hass.localize(
-          "ui.panel.config.bluetooth.scanner_mode_mismatch_uart"
-        )
-      );
-    }
-
-    return html`<ha-alert alert-type="warning">
-      <div>
-        ${this.hass.localize(
-          "ui.panel.config.bluetooth.scanner_mode_mismatch",
-          {
-            requested: formatMode(scannerState.requested_mode),
-            current: formatMode(scannerState.current_mode),
-          }
-        )}
-      </div>
-      <ul>
-        ${instructions.map((instruction) => html`<li>${instruction}</li>`)}
-      </ul>
-    </ha-alert>`;
-  }
-
-  private _renderScannerState() {
-    if (!this._configEntry || !this._scannerState) {
-      return html`<div>
-        ${this.hass.localize(
-          "ui.panel.config.bluetooth.no_scanner_state_available"
-        )}
-      </div>`;
-    }
-
-    const scannerState = this._scannerState;
-    // Find the scanner details for this source
-    const scannerDetails = this._scannerDetails?.[scannerState.source];
-    const scannerType: HaScannerType =
-      scannerDetails?.scanner_type ?? "unknown";
-
-    const formatMode = (mode: string | null) => {
-      switch (mode) {
-        case null:
-          return this.hass.localize(
-            "ui.panel.config.bluetooth.scanning_mode_none"
-          );
-        case "active":
-          return this.hass.localize(
-            "ui.panel.config.bluetooth.scanning_mode_active"
-          );
-        case "passive":
-          return this.hass.localize(
-            "ui.panel.config.bluetooth.scanning_mode_passive"
-          );
-        default:
-          return mode; // Fallback for unknown modes
-      }
-    };
-
-    return html`
-      <div class="scanner-state">
-        <div class="state-row">
-          <span
-            >${this.hass.localize(
-              "ui.panel.config.bluetooth.current_scanning_mode"
-            )}:</span
-          >
-          <span class="state-value"
-            >${formatMode(scannerState.current_mode)}</span
-          >
-        </div>
-        <div class="state-row">
-          <span
-            >${this.hass.localize(
-              "ui.panel.config.bluetooth.requested_scanning_mode"
-            )}:</span
-          >
-          <span class="state-value"
-            >${formatMode(scannerState.requested_mode)}</span
-          >
-        </div>
-        ${scannerState.current_mode !== scannerState.requested_mode
-          ? this._renderScannerMismatchWarning(
-              scannerState,
-              scannerType,
-              formatMode
-            )
-          : nothing}
-      </div>
-    `;
-  }
-
   private _renderConnectionAllocations() {
     if (this._connectionAllocationsError) {
       return html`<ha-alert alert-type="error"
@@ -385,18 +220,6 @@ export class BluetoothConfigDashboard extends LitElement {
           display: flex;
           justify-content: flex-end;
         }
-        .scanner-state {
-          margin-bottom: 16px;
-        }
-        .state-row {
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          padding: 4px 0;
-        }
-        .state-value {
-          font-weight: 500;
-        }
       `,
     ];
   }

src/panels/config/repairs/show-dialog-repair-flow.ts

@@ -289,15 +289,6 @@ export const showRepairsFlowDialog = (
         );
       },
 
-      renderMenuOptionDescription(hass, step, option) {
-        return hass.localize(
-          `component.${issue.domain}.issues.${
-            issue.translation_key || issue.issue_id
-          }.fix_flow.step.${step.step_id}.menu_option_descriptions.${option}`,
-          mergePlaceholders(issue, step)
-        );
-      },
-
       renderLoadingDescription(hass, reason) {
         return (
           hass.localize(

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

@@ -15,6 +15,8 @@ import {
   mdiRobotConfused,
   mdiTag,
   mdiTransitConnection,
+  mdiUnfoldLessHorizontal,
+  mdiUnfoldMoreHorizontal,
 } from "@mdi/js";
 import type { CSSResultGroup, PropertyValues, TemplateResult } from "lit";
 import { LitElement, css, html, nothing } from "lit";
@@ -340,6 +342,30 @@ export class HaScriptEditor extends SubscribeMixin(
             <ha-svg-icon slot="graphic" .path=${mdiPlaylistEdit}></ha-svg-icon>
           </ha-list-item>
 
+          ${!useBlueprint
+            ? html`
+                <ha-list-item graphic="icon" @click=${this._collapseAll}>
+                  <ha-svg-icon
+                    slot="graphic"
+                    .path=${mdiUnfoldLessHorizontal}
+                  ></ha-svg-icon>
+                  ${this.hass.localize(
+                    "ui.panel.config.automation.editor.collapse_all"
+                  )}
+                </ha-list-item>
+
+                <ha-list-item graphic="icon" @click=${this._expandAll}>
+                  <ha-svg-icon
+                    slot="graphic"
+                    .path=${mdiUnfoldMoreHorizontal}
+                  ></ha-svg-icon>
+                  ${this.hass.localize(
+                    "ui.panel.config.automation.editor.expand_all"
+                  )}
+                </ha-list-item>
+              `
+            : nothing}
+
           <li divider role="separator"></li>
 
           <ha-list-item
@@ -1035,12 +1061,10 @@ export class HaScriptEditor extends SubscribeMixin(
     return this._confirmUnsavedChanged();
   }
 
-  // @ts-ignore
   private _collapseAll() {
     this._manualEditor?.collapseAll();
   }
 
-  // @ts-ignore
   private _expandAll() {
     this._manualEditor?.expandAll();
   }

src/panels/config/script/ha-script-field-row.ts

@@ -162,7 +162,8 @@ export default class HaScriptFieldRow extends LitElement {
     ev?.stopPropagation();
 
     if (this._selected) {
-      fireEvent(this, "request-close-sidebar");
+      this._selected = false;
+      fireEvent(this, "close-sidebar");
       return;
     }
 
@@ -175,7 +176,8 @@ export default class HaScriptFieldRow extends LitElement {
     ev?.stopPropagation();
 
     if (this._selectorRowSelected) {
-      fireEvent(this, "request-close-sidebar");
+      this._selectorRowSelected = false;
+      fireEvent(this, "close-sidebar");
       return;
     }
 
@@ -234,12 +236,12 @@ export default class HaScriptFieldRow extends LitElement {
     } satisfies ScriptFieldSidebarConfig);
 
     if (this.narrow) {
-      window.setTimeout(() => {
+      requestAnimationFrame(() => {
         this.scrollIntoView({
           block: "start",
           behavior: "smooth",
         });
-      }, 180); // duration of transition of added padding for bottom sheet
+      });
     }
   }
 

src/panels/config/script/ha-script-fields.ts

@@ -76,12 +76,10 @@ export default class HaScriptFields extends LitElement {
       row.focus();
 
       if (this.narrow) {
-        window.setTimeout(() => {
-          row.scrollIntoView({
-            block: "start",
-            behavior: "smooth",
-          });
-        }, 180); // duration of transition of added padding for bottom sheet
+        row.scrollIntoView({
+          block: "start",
+          behavior: "smooth",
+        });
       }
     });
   }

src/panels/config/script/manual-script-editor.ts

@@ -170,7 +170,6 @@ export class HaManualScriptEditor extends LitElement {
               .disabled=${this.disabled}
               .narrow=${this.narrow}
               @open-sidebar=${this._openSidebar}
-              @request-close-sidebar=${this._triggerCloseSidebar}
               @close-sidebar=${this._handleCloseSidebar}
             ></ha-script-fields>`
         : nothing
@@ -201,7 +200,6 @@ export class HaManualScriptEditor extends LitElement {
       .highlightedActions=${this._pastedConfig?.sequence || []}
       @value-changed=${this._sequenceChanged}
       @open-sidebar=${this._openSidebar}
-      @request-close-sidebar=${this._triggerCloseSidebar}
       @close-sidebar=${this._handleCloseSidebar}
       .hass=${this.hass}
       .narrow=${this.narrow}
@@ -220,11 +218,7 @@ export class HaManualScriptEditor extends LitElement {
         })}
       >
         <div class="content-wrapper">
-          <div
-            class="content ${this._sidebarConfig && this.narrow
-              ? "has-bottom-sheet"
-              : ""}"
-          >
+          <div class="content">
             <slot name="alerts"></slot>
             ${this._renderContent()}
           </div>
@@ -508,13 +502,11 @@ export class HaManualScriptEditor extends LitElement {
     };
   }
 
-  private _triggerCloseSidebar() {
+  private _closeSidebar() {
     if (this._sidebarConfig) {
-      if (this._sidebarElement) {
-        this._sidebarElement.triggerCloseSidebar();
-        return;
-      }
-      this._sidebarConfig?.close();
+      const closeRow = this._sidebarConfig?.close;
+      this._sidebarConfig = undefined;
+      closeRow?.();
     }
   }
 
@@ -523,7 +515,7 @@ export class HaManualScriptEditor extends LitElement {
   }
 
   private _saveScript() {
-    this._triggerCloseSidebar();
+    this._closeSidebar();
     fireEvent(this, "save-script");
   }
 

src/panels/lovelace/card-features/hui-button-card-feature.ts

@@ -4,8 +4,6 @@ import { customElement, property, state } from "lit/decorators";
 import { computeDomain } from "../../../common/entity/compute_domain";
 import "../../../components/ha-control-button";
 import "../../../components/ha-control-button-group";
-import { hasScriptFields } from "../../../data/script";
-import { showMoreInfoDialog } from "../../../dialogs/more-info/show-ha-more-info-dialog";
 import type { HomeAssistant } from "../../../types";
 import type { LovelaceCardFeature, LovelaceCardFeatureEditor } from "../types";
 import { cardFeatureStyles } from "./common/card-feature-styles";
@@ -48,14 +46,6 @@ class HuiButtonCardFeature extends LitElement implements LovelaceCardFeature {
     const service =
       domain === "button" || domain === "input_button" ? "press" : "turn_on";
 
-    if (domain === "script") {
-      const entityId = this._stateObj.entity_id;
-      if (hasScriptFields(this.hass!, entityId)) {
-        showMoreInfoDialog(this, { entityId: entityId });
-        return;
-      }
-    }
-
     this.hass.callService(domain, service, {
       entity_id: this._stateObj.entity_id,
     });

src/panels/lovelace/card-features/hui-history-chart-card-feature.ts

@@ -0,0 +1,317 @@
+import { css, html, LitElement, nothing, svg } from "lit";
+import { customElement, property, state } from "lit/decorators";
+import { computeDomain } from "../../../common/entity/compute_domain";
+import {
+  computeHistory,
+  subscribeHistoryStatesTimeWindow,
+} from "../../../data/history";
+import type {
+  HistoryResult,
+  LineChartUnit,
+  TimelineEntity,
+} from "../../../data/history";
+import type { HomeAssistant } from "../../../types";
+import type { LovelaceCardFeature } from "../types";
+import type {
+  LovelaceCardFeatureContext,
+  HistoryChartCardFeatureConfig,
+} from "./types";
+import { getSensorNumericDeviceClasses } from "../../../data/sensor";
+import { isComponentLoaded } from "../../../common/config/is_component_loaded";
+import { SubscribeMixin } from "../../../mixins/subscribe-mixin";
+import { computeTimelineColor } from "../../../components/chart/timeline-color";
+import { downSampleLineData } from "../../../components/chart/down-sample";
+import { fireEvent } from "../../../common/dom/fire_event";
+
+export const supportsHistoryChartCardFeature = (
+  _hass: HomeAssistant,
+  context: LovelaceCardFeatureContext
+) =>
+  !!context.entity_id &&
+  ["sensor", "binary_sensor"].includes(computeDomain(context.entity_id));
+
+@customElement("hui-history-chart-card-feature")
+class HuiHistoryChartCardFeature
+  extends SubscribeMixin(LitElement)
+  implements LovelaceCardFeature
+{
+  @property({ attribute: false, hasChanged: () => false })
+  public hass?: HomeAssistant;
+
+  @property({ attribute: false }) public context?: LovelaceCardFeatureContext;
+
+  @state() private _config?: HistoryChartCardFeatureConfig;
+
+  @state() private _stateHistory?: HistoryResult;
+
+  private _interval?: number;
+
+  static getStubConfig(): HistoryChartCardFeatureConfig {
+    return {
+      type: "history-chart",
+      hours_to_show: 24,
+    };
+  }
+
+  public setConfig(config: HistoryChartCardFeatureConfig): void {
+    if (!config) {
+      throw new Error("Invalid configuration");
+    }
+    this._config = config;
+  }
+
+  public connectedCallback() {
+    super.connectedCallback();
+    // redraw the graph every minute to update the time axis
+    clearInterval(this._interval);
+    this._interval = window.setInterval(() => this.requestUpdate(), 1000 * 60);
+  }
+
+  public disconnectedCallback() {
+    super.disconnectedCallback();
+    clearInterval(this._interval);
+  }
+
+  protected hassSubscribe() {
+    return [this._subscribeHistory()];
+  }
+
+  protected render() {
+    if (
+      !this._config ||
+      !this.hass ||
+      !this.context ||
+      !this._stateHistory ||
+      !supportsHistoryChartCardFeature(this.hass, this.context)
+    ) {
+      return nothing;
+    }
+
+    const line = this._stateHistory.line[0];
+    const timeline = this._stateHistory.timeline[0];
+    const width = this.clientWidth;
+    const height = this.clientHeight;
+    if (line) {
+      const { points, yAxisOrigin } = this._generateLinePoints(line);
+      const { paths, filledPaths } = this._getLinePaths(points, yAxisOrigin);
+
+      return html`
+        <div class="line" @click=${this._handleClick}>
+          ${svg`<svg width="${width}" height="${height}" viewBox="0 0 ${width} ${height}">
+            ${paths.map(
+              (path) =>
+                svg`<path d="${path}" stroke="var(--feature-color)" stroke-width="1" stroke-linecap="round" fill="none" />`
+            )}
+            ${filledPaths.map(
+              (path) =>
+                svg`<path d="${path}" stroke="none" stroke-linecap="round" fill="var(--feature-color)" fill-opacity="0.2" />`
+            )}
+              </svg>`}
+        </div>
+      `;
+    }
+    if (timeline) {
+      const ranges = this._generateTimelineRanges(timeline);
+      return html`
+        <div class="timeline" @click=${this._handleClick}>
+          ${svg`<svg width="${width}" height="${height}" viewBox="0 0 ${width} ${height}">
+            <g>
+                ${ranges.map((r) => svg`<rect x="${r.startX}" y="0" width="${r.endX - r.startX}" height="${height}" fill="${r.color}" />`)}
+            </g>
+            </svg>`}
+        </div>
+      `;
+    }
+    return nothing;
+  }
+
+  private _handleClick() {
+    // open more info dialog to show more detailed history
+    fireEvent(this, "hass-more-info", { entityId: this.context!.entity_id! });
+  }
+
+  private async _subscribeHistory(): Promise<() => Promise<void>> {
+    if (
+      !isComponentLoaded(this.hass!, "history") ||
+      !this.context?.entity_id ||
+      !this._config
+    ) {
+      return () => Promise.resolve();
+    }
+
+    const { numeric_device_classes: sensorNumericDeviceClasses } =
+      await getSensorNumericDeviceClasses(this.hass!);
+
+    return subscribeHistoryStatesTimeWindow(
+      this.hass!,
+      (historyStates) => {
+        this._stateHistory = computeHistory(
+          this.hass!,
+          historyStates,
+          [this.context!.entity_id!],
+          this.hass!.localize,
+          sensorNumericDeviceClasses,
+          false
+        );
+      },
+      this._config!.hours_to_show ?? 24,
+      [this.context!.entity_id!]
+    );
+  }
+
+  private _generateLinePoints(line: LineChartUnit): {
+    points: { x: number; y: number }[];
+    yAxisOrigin: number;
+  } {
+    const width = this.clientWidth;
+    const height = this.clientHeight;
+    let yAxisOrigin = height;
+    let minY = Number(line.data[0].states[0].state);
+    let maxY = Number(line.data[0].states[0].state);
+    const minX = line.data[0].states[0].last_changed;
+    const maxX = Date.now();
+    line.data[0].states.forEach((stateData) => {
+      const stateValue = Number(stateData.state);
+      if (stateValue < minY) {
+        minY = stateValue;
+      } else if (stateValue > maxY) {
+        maxY = stateValue;
+      }
+    });
+    const rangeY = maxY - minY || minY * 0.1;
+    const sampledData = downSampleLineData(
+      line.data[0].states.map((stateData) => [
+        stateData.last_changed,
+        Number(stateData.state),
+      ]),
+      width,
+      minX,
+      maxX
+    );
+    if (maxY < 0) {
+      // all values are negative
+      // add margin
+      maxY += rangeY * 0.1;
+      maxY = Math.min(0, maxY);
+      yAxisOrigin = 0;
+    } else if (minY < 0) {
+      // some values are negative
+      yAxisOrigin = (maxY / (maxY - minY || 1)) * height;
+    } else {
+      // all values are positive
+      // add margin
+      minY -= rangeY * 0.1;
+      minY = Math.max(0, minY);
+    }
+    const yDenom = maxY - minY || 1;
+    const xDenom = maxX - minX || 1;
+    const points = sampledData!.map((point) => {
+      const x = ((point![0] - minX) / xDenom) * width;
+      const y = height - ((Number(point![1]) - minY) / yDenom) * height;
+      return { x, y };
+    });
+    points.push({ x: width, y: points[points.length - 1].y });
+    return { points, yAxisOrigin };
+  }
+
+  private _generateTimelineRanges(timeline: TimelineEntity) {
+    if (timeline.data.length === 0) {
+      return [];
+    }
+    const computedStyles = getComputedStyle(this);
+    const width = this.clientWidth;
+    const minX = timeline.data[0].last_changed;
+    const maxX = Date.now();
+    let prevEndX = 0;
+    let prevStateColor = "";
+    const ranges = timeline.data.map((t) => {
+      const x = ((t.last_changed - minX) / (maxX - minX)) * width;
+      const range = {
+        startX: prevEndX,
+        endX: x,
+        color: prevStateColor,
+      };
+      prevStateColor = computeTimelineColor(
+        t.state,
+        computedStyles,
+        this.hass!.states[timeline.entity_id]
+      );
+      prevEndX = x;
+      return range;
+    });
+    ranges.push({
+      startX: prevEndX,
+      endX: width,
+      color: prevStateColor,
+    });
+    return ranges;
+  }
+
+  private _getLinePaths(
+    points: { x: number; y: number }[],
+    yAxisOrigin: number
+  ) {
+    const paths: string[] = [];
+    const filledPaths: string[] = [];
+    if (!points.length) {
+      return { paths, filledPaths };
+    }
+    // path can interupted by missing data, so we need to split the path into segments
+    const pathSegments: { x: number; y: number }[][] = [[]];
+    points.forEach((point) => {
+      if (!isNaN(point.y)) {
+        pathSegments[pathSegments.length - 1].push(point);
+      } else if (pathSegments[pathSegments.length - 1].length > 0) {
+        pathSegments.push([]);
+      }
+    });
+
+    pathSegments.forEach((pathPoints) => {
+      // create a smoothed path
+      let next: { x: number; y: number };
+      let path = "";
+      let last = pathPoints[0];
+
+      path += `M ${last.x},${last.y}`;
+
+      pathPoints.forEach((coord) => {
+        next = coord;
+        path += ` ${(next.x + last.x) / 2},${(next.y + last.y) / 2}`;
+        path += ` Q${next.x},${next.y}`;
+        last = next;
+      });
+
+      path += ` ${next!.x},${next!.y}`;
+      paths.push(path);
+      filledPaths.push(
+        path +
+          ` L ${next!.x},${yAxisOrigin} L ${pathPoints[0].x},${yAxisOrigin} Z`
+      );
+    });
+
+    return { paths, filledPaths };
+  }
+
+  static styles = css`
+    :host {
+      display: block;
+      width: 100%;
+      height: var(--feature-height);
+    }
+    :host > div {
+      width: 100%;
+      height: 100%;
+      cursor: pointer;
+    }
+    .timeline {
+      border-radius: 4px;
+      overflow: hidden;
+    }
+  `;
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "hui-history-chart-card-feature": HuiHistoryChartCardFeature;
+  }
+}

src/panels/lovelace/card-features/hui-trend-graph-card-feature.ts

@@ -1,164 +0,0 @@
-import { css, html, LitElement, nothing } from "lit";
-import { customElement, property, state } from "lit/decorators";
-import { isComponentLoaded } from "../../../common/config/is_component_loaded";
-import { computeDomain } from "../../../common/entity/compute_domain";
-import { isNumericFromAttributes } from "../../../common/number/format_number";
-import "../../../components/ha-spinner";
-import { subscribeHistoryStatesTimeWindow } from "../../../data/history";
-import { SubscribeMixin } from "../../../mixins/subscribe-mixin";
-import type { HomeAssistant } from "../../../types";
-import { coordinatesMinimalResponseCompressedState } from "../common/graph/coordinates";
-import "../components/hui-graph-base";
-import type { LovelaceCardFeature, LovelaceCardFeatureEditor } from "../types";
-import type {
-  TrendGraphCardFeatureConfig,
-  LovelaceCardFeatureContext,
-} from "./types";
-
-export const supportsTrendGraphCardFeature = (
-  hass: HomeAssistant,
-  context: LovelaceCardFeatureContext
-) => {
-  const stateObj = context.entity_id
-    ? hass.states[context.entity_id]
-    : undefined;
-  if (!stateObj) return false;
-  const domain = computeDomain(stateObj.entity_id);
-  return domain === "sensor" && isNumericFromAttributes(stateObj.attributes);
-};
-
-export const DEFAULT_HOURS_TO_SHOW = 24;
-
-@customElement("hui-trend-graph-card-feature")
-class HuiHistoryChartCardFeature
-  extends SubscribeMixin(LitElement)
-  implements LovelaceCardFeature
-{
-  @property({ attribute: false, hasChanged: () => false })
-  public hass?: HomeAssistant;
-
-  @property({ attribute: false }) public context?: LovelaceCardFeatureContext;
-
-  @state() private _config?: TrendGraphCardFeatureConfig;
-
-  @state() private _coordinates?: [number, number][];
-
-  private _interval?: number;
-
-  static getStubConfig(): TrendGraphCardFeatureConfig {
-    return {
-      type: "trend-graph",
-    };
-  }
-
-  public static async getConfigElement(): Promise<LovelaceCardFeatureEditor> {
-    await import(
-      "../editor/config-elements/hui-trend-graph-card-feature-editor"
-    );
-    return document.createElement("hui-trend-graph-card-feature-editor");
-  }
-
-  public setConfig(config: TrendGraphCardFeatureConfig): void {
-    if (!config) {
-      throw new Error("Invalid configuration");
-    }
-    this._config = config;
-  }
-
-  public connectedCallback() {
-    super.connectedCallback();
-    // redraw the graph every minute to update the time axis
-    clearInterval(this._interval);
-    this._interval = window.setInterval(() => this.requestUpdate(), 1000 * 60);
-  }
-
-  public disconnectedCallback() {
-    super.disconnectedCallback();
-    clearInterval(this._interval);
-  }
-
-  protected hassSubscribe() {
-    return [this._subscribeHistory()];
-  }
-
-  protected render() {
-    if (
-      !this._config ||
-      !this.hass ||
-      !this.context ||
-      !supportsTrendGraphCardFeature(this.hass, this.context)
-    ) {
-      return nothing;
-    }
-    if (!this._coordinates) {
-      return html`
-        <div class="container">
-          <ha-spinner size="small"></ha-spinner>
-        </div>
-      `;
-    }
-    if (!this._coordinates.length) {
-      return html`
-        <div class="container">
-          <div class="info">No state history found.</div>
-        </div>
-      `;
-    }
-    return html`
-      <hui-graph-base .coordinates=${this._coordinates}></hui-graph-base>
-    `;
-  }
-
-  private async _subscribeHistory(): Promise<() => Promise<void>> {
-    if (
-      !isComponentLoaded(this.hass!, "history") ||
-      !this.context?.entity_id ||
-      !this._config
-    ) {
-      return () => Promise.resolve();
-    }
-
-    const hourToShow = this._config.hours_to_show ?? DEFAULT_HOURS_TO_SHOW;
-
-    return subscribeHistoryStatesTimeWindow(
-      this.hass!,
-      (historyStates) => {
-        this._coordinates =
-          coordinatesMinimalResponseCompressedState(
-            historyStates[this.context!.entity_id!],
-            hourToShow,
-            500,
-            2,
-            undefined
-          ) || [];
-      },
-      hourToShow,
-      [this.context!.entity_id!]
-    );
-  }
-
-  static styles = css`
-    :host {
-      display: flex;
-      width: 100%;
-      height: var(--feature-height);
-      flex-direction: column;
-      justify-content: flex-end;
-      align-items: flex-end;
-      pointer-events: none !important;
-    }
-    hui-graph-base {
-      width: 100%;
-      --accent-color: var(--feature-color);
-      border-bottom-right-radius: 8px;
-      border-bottom-left-radius: 8px;
-      overflow: hidden;
-    }
-  `;
-}
-
-declare global {
-  interface HTMLElementTagNameMap {
-    "hui-trend-graph-card-feature": HuiHistoryChartCardFeature;
-  }
-}

src/panels/lovelace/card-features/types.ts

@@ -187,9 +187,9 @@ export interface UpdateActionsCardFeatureConfig {
   backup?: "yes" | "no" | "ask";
 }
 
-export interface TrendGraphCardFeatureConfig {
-  type: "trend-graph";
-  hours_to_show?: number;
+export interface HistoryChartCardFeatureConfig {
+  type: "history-chart";
+  hours_to_show: number;
 }
 
 export const AREA_CONTROLS = [
@@ -239,7 +239,7 @@ export type LovelaceCardFeatureConfig =
   | FanOscillateCardFeatureConfig
   | FanPresetModesCardFeatureConfig
   | FanSpeedCardFeatureConfig
-  | TrendGraphCardFeatureConfig
+  | HistoryChartCardFeatureConfig
   | HumidifierToggleCardFeatureConfig
   | HumidifierModesCardFeatureConfig
   | LawnMowerCommandsCardFeatureConfig
@@ -251,7 +251,7 @@ export type LovelaceCardFeatureConfig =
   | MediaPlayerVolumeSliderCardFeatureConfig
   | NumericInputCardFeatureConfig
   | SelectOptionsCardFeatureConfig
-  | TrendGraphCardFeatureConfig
+  | HistoryChartCardFeatureConfig
   | TargetHumidityCardFeatureConfig
   | TargetTemperatureCardFeatureConfig
   | ToggleCardFeatureConfig

src/panels/lovelace/cards/energy/hui-energy-sankey-card.ts

@@ -109,7 +109,7 @@ class HuiEnergySankeyCard
         "ui.panel.lovelace.cards.energy.energy_distribution.home"
       ),
       value: Math.max(0, consumption.total.used_total),
-      color: computedStyle.getPropertyValue("--primary-color").trim(),
+      color: computedStyle.getPropertyValue("--primary-color"),
       index: 1,
     };
     nodes.push(homeNode);
@@ -125,9 +125,7 @@ class HuiEnergySankeyCard
           "ui.panel.lovelace.cards.energy.energy_distribution.battery"
         ),
         value: totalBatteryOut,
-        color: computedStyle
-          .getPropertyValue("--energy-battery-out-color")
-          .trim(),
+        color: computedStyle.getPropertyValue("--energy-battery-out-color"),
         index: 0,
       });
       links.push({
@@ -143,9 +141,7 @@ class HuiEnergySankeyCard
           "ui.panel.lovelace.cards.energy.energy_distribution.battery"
         ),
         value: totalBatteryIn,
-        color: computedStyle
-          .getPropertyValue("--energy-battery-in-color")
-          .trim(),
+        color: computedStyle.getPropertyValue("--energy-battery-in-color"),
         index: 1,
       });
       if (consumption.total.grid_to_battery > 0) {
@@ -173,9 +169,9 @@ class HuiEnergySankeyCard
           "ui.panel.lovelace.cards.energy.energy_distribution.grid"
         ),
         value: totalFromGrid,
-        color: computedStyle
-          .getPropertyValue("--energy-grid-consumption-color")
-          .trim(),
+        color: computedStyle.getPropertyValue(
+          "--energy-grid-consumption-color"
+        ),
         index: 0,
       });
 
@@ -196,7 +192,7 @@ class HuiEnergySankeyCard
           "ui.panel.lovelace.cards.energy.energy_distribution.solar"
         ),
         value: totalSolarProduction,
-        color: computedStyle.getPropertyValue("--energy-solar-color").trim(),
+        color: computedStyle.getPropertyValue("--energy-solar-color"),
         index: 0,
       });
 
@@ -217,9 +213,7 @@ class HuiEnergySankeyCard
           "ui.panel.lovelace.cards.energy.energy_distribution.grid"
         ),
         value: totalToGrid,
-        color: computedStyle
-          .getPropertyValue("--energy-grid-return-color")
-          .trim(),
+        color: computedStyle.getPropertyValue("--energy-grid-return-color"),
         index: 1,
       });
       if (consumption.total.battery_to_grid > 0) {
@@ -301,7 +295,7 @@ class HuiEnergySankeyCard
               label: this.hass.floors[floorId].name,
               value: floors[floorId].value,
               index: 2,
-              color: computedStyle.getPropertyValue("--primary-color").trim(),
+              color: computedStyle.getPropertyValue("--primary-color"),
             });
             links.push({
               source: "home",
@@ -322,7 +316,7 @@ class HuiEnergySankeyCard
                 label: this.hass.areas[areaId]!.name,
                 value: areas[areaId].value,
                 index: 3,
-                color: computedStyle.getPropertyValue("--primary-color").trim(),
+                color: computedStyle.getPropertyValue("--primary-color"),
               });
               links.push({
                 source: floorNodeId,
@@ -366,9 +360,7 @@ class HuiEnergySankeyCard
           "ui.panel.lovelace.cards.energy.energy_devices_detail_graph.untracked_consumption"
         ),
         value: untrackedConsumption,
-        color: computedStyle
-          .getPropertyValue("--state-unavailable-color")
-          .trim(),
+        color: computedStyle.getPropertyValue("--state-unavailable-color"),
         index: 3 + deviceSections.length,
       });
       links.push({

src/panels/lovelace/cards/hui-home-summary-card.ts

@@ -31,8 +31,8 @@ import type { HomeSummaryCard } from "./types";
 const COLORS: Record<HomeSummary, string> = {
   lights: "amber",
   climate: "deep-orange",
-  security: "blue-grey",
-  media_players: "blue",
+  security: "blue",
+  media_players: "purple",
 };
 
 @customElement("hui-home-summary-card")

src/panels/lovelace/common/graph/coordinates.ts

@@ -14,8 +14,8 @@ const calcPoints = (
   detail: number,
   min: number,
   max: number
-): [number, number][] => {
-  const coords = [] as [number, number][];
+): number[][] => {
+  const coords = [] as number[][];
   const height = 80;
   let yRatio = (max - min) / height;
   yRatio = yRatio !== 0 ? yRatio : height;
@@ -61,7 +61,7 @@ export const coordinates = (
   width: number,
   detail: number,
   limits?: { min?: number; max?: number }
-): [number, number][] | undefined => {
+): number[][] | undefined => {
   history.forEach((item) => {
     item.state = Number(item.state);
   });
@@ -119,7 +119,7 @@ export const coordinatesMinimalResponseCompressedState = (
   width: number,
   detail: number,
   limits?: { min?: number; max?: number }
-): [number, number][] | undefined => {
+): number[][] | undefined => {
   if (!history) {
     return undefined;
   }

src/panels/lovelace/components/hui-graph-base.ts

@@ -13,7 +13,7 @@ export class HuiGraphBase extends LitElement {
   protected render(): TemplateResult {
     return html`
       ${this._path
-        ? svg`<svg width="100%" height="100%" viewBox="0 0 500 100" preserveAspectRatio="none">
+        ? svg`<svg width="100%" height="100%" viewBox="0 0 500 100">
           <g>
             <mask id="fill">
               <path
@@ -25,10 +25,8 @@ export class HuiGraphBase extends LitElement {
             <rect height="100%" width="100%" id="fill-rect" fill="var(--accent-color)" mask="url(#fill)"></rect>
             <mask id="line">
               <path
-                vector-effect="non-scaling-stroke"
-                class='line'
                 fill="none"
-                stroke="white"
+                stroke="var(--accent-color)"
                 stroke-width="${strokeWidth}"
                 stroke-linecap="round"
                 stroke-linejoin="round"
@@ -56,10 +54,6 @@ export class HuiGraphBase extends LitElement {
     :host {
       display: flex;
       width: 100%;
-      height: 100%;
-    }
-    .line {
-      opacity: 0.8;
     }
     .fill {
       opacity: 0.1;

src/panels/lovelace/create-element/create-card-feature-element.ts

@@ -36,7 +36,7 @@ import "../card-features/hui-valve-position-card-feature";
 import "../card-features/hui-water-heater-operation-modes-card-feature";
 import "../card-features/hui-area-controls-card-feature";
 import "../card-features/hui-bar-gauge-card-feature";
-import "../card-features/hui-trend-graph-card-feature";
+import "../card-features/hui-history-chart-card-feature";
 
 import type { LovelaceCardFeatureConfig } from "../card-features/types";
 import {
@@ -75,7 +75,7 @@ const TYPES = new Set<LovelaceCardFeatureConfig["type"]>([
   "media-player-volume-slider",
   "numeric-input",
   "select-options",
-  "trend-graph",
+  "history-chart",
   "target-humidity",
   "target-temperature",
   "toggle",

src/panels/lovelace/editor/config-elements/hui-card-features-editor.ts

@@ -46,7 +46,7 @@ import { supportsMediaPlayerPlaybackCardFeature } from "../../card-features/hui-
 import { supportsMediaPlayerVolumeSliderCardFeature } from "../../card-features/hui-media-player-volume-slider-card-feature";
 import { supportsNumericInputCardFeature } from "../../card-features/hui-numeric-input-card-feature";
 import { supportsSelectOptionsCardFeature } from "../../card-features/hui-select-options-card-feature";
-import { supportsTrendGraphCardFeature } from "../../card-features/hui-trend-graph-card-feature";
+import { supportsHistoryChartCardFeature } from "../../card-features/hui-history-chart-card-feature";
 import { supportsTargetHumidityCardFeature } from "../../card-features/hui-target-humidity-card-feature";
 import { supportsTargetTemperatureCardFeature } from "../../card-features/hui-target-temperature-card-feature";
 import { supportsToggleCardFeature } from "../../card-features/hui-toggle-card-feature";
@@ -100,7 +100,7 @@ const UI_FEATURE_TYPES = [
   "media-player-volume-slider",
   "numeric-input",
   "select-options",
-  "trend-graph",
+  "history-chart",
   "target-humidity",
   "target-temperature",
   "toggle",
@@ -128,7 +128,6 @@ const EDITABLES_FEATURE_TYPES = new Set<UiFeatureTypes>([
   "lawn-mower-commands",
   "numeric-input",
   "select-options",
-  "trend-graph",
   "update-actions",
   "vacuum-commands",
   "water-heater-operation-modes",
@@ -169,7 +168,7 @@ const SUPPORTS_FEATURE_TYPES: Record<
   "media-player-volume-slider": supportsMediaPlayerVolumeSliderCardFeature,
   "numeric-input": supportsNumericInputCardFeature,
   "select-options": supportsSelectOptionsCardFeature,
-  "trend-graph": supportsTrendGraphCardFeature,
+  "history-chart": supportsHistoryChartCardFeature,
   "target-humidity": supportsTargetHumidityCardFeature,
   "target-temperature": supportsTargetTemperatureCardFeature,
   toggle: supportsToggleCardFeature,

src/panels/lovelace/editor/config-elements/hui-trend-graph-card-feature-editor.ts

@@ -1,82 +0,0 @@
-import { html, LitElement, nothing } from "lit";
-import { customElement, property, state } from "lit/decorators";
-import { fireEvent } from "../../../../common/dom/fire_event";
-import "../../../../components/ha-form/ha-form";
-import type {
-  HaFormSchema,
-  SchemaUnion,
-} from "../../../../components/ha-form/types";
-import type { HomeAssistant } from "../../../../types";
-import { DEFAULT_HOURS_TO_SHOW } from "../../card-features/hui-trend-graph-card-feature";
-import type {
-  LovelaceCardFeatureContext,
-  TrendGraphCardFeatureConfig,
-} from "../../card-features/types";
-import type { LovelaceCardFeatureEditor } from "../../types";
-
-const SCHEMA = [
-  {
-    name: "hours_to_show",
-    default: DEFAULT_HOURS_TO_SHOW,
-    selector: { number: { min: 1, mode: "box" } },
-  },
-] as const satisfies HaFormSchema[];
-
-@customElement("hui-trend-graph-card-feature-editor")
-export class HuiTrendGraphCardFeatureEditor
-  extends LitElement
-  implements LovelaceCardFeatureEditor
-{
-  @property({ attribute: false }) public hass?: HomeAssistant;
-
-  @property({ attribute: false }) public context?: LovelaceCardFeatureContext;
-
-  @state() private _config?: TrendGraphCardFeatureConfig;
-
-  public setConfig(config: TrendGraphCardFeatureConfig): void {
-    this._config = config;
-  }
-
-  protected render() {
-    if (!this.hass || !this._config) {
-      return nothing;
-    }
-
-    const data = { ...this._config };
-
-    if (!this._config.hours_to_show) {
-      data.hours_to_show = DEFAULT_HOURS_TO_SHOW;
-    }
-
-    return html`
-      <ha-form
-        .hass=${this.hass}
-        .data=${data}
-        .schema=${SCHEMA}
-        .computeLabel=${this._computeLabelCallback}
-        @value-changed=${this._valueChanged}
-      ></ha-form>
-    `;
-  }
-
-  private _valueChanged(ev: CustomEvent): void {
-    fireEvent(this, "config-changed", { config: ev.detail.value });
-  }
-
-  private _computeLabelCallback = (schema: SchemaUnion<typeof SCHEMA>) => {
-    switch (schema.name) {
-      case "hours_to_show":
-        return this.hass!.localize(
-          `ui.panel.lovelace.editor.card.generic.${schema.name}`
-        );
-      default:
-        return "";
-    }
-  };
-}
-
-declare global {
-  interface HTMLElementTagNameMap {
-    "hui-trend-graph-card-feature-editor": HuiTrendGraphCardFeatureEditor;
-  }
-}

src/panels/lovelace/header-footer/hui-graph-header-footer.ts

@@ -61,7 +61,7 @@ export class HuiGraphHeaderFooter
 
   @state() protected _config?: GraphHeaderFooterConfig;
 
-  @state() private _coordinates?: [number, number][];
+  @state() private _coordinates?: number[][];
 
   private _error?: string;
 

src/panels/lovelace/strategies/home/home-climate-view-strategy.ts

@@ -33,28 +33,8 @@ const processAreasForClimate = (
       area: area.area_id,
     });
     const areaEntities = entities.filter(areaFilter);
-    const areaCards: LovelaceCardConfig[] = [];
 
-    const temperatureEntityId = area.temperature_entity_id;
-    if (temperatureEntityId && hass.states[temperatureEntityId]) {
-      areaCards.push({
-        ...computeTileCard(temperatureEntityId),
-        features: [{ type: "trend-graph" }],
-      });
-    }
-    const humidityEntityId = area.humidity_entity_id;
-    if (humidityEntityId && hass.states[humidityEntityId]) {
-      areaCards.push({
-        ...computeTileCard(humidityEntityId),
-        features: [{ type: "trend-graph" }],
-      });
-    }
-
-    for (const entityId of areaEntities) {
-      areaCards.push(computeTileCard(entityId));
-    }
-
-    if (areaCards.length > 0) {
+    if (areaEntities.length > 0) {
       cards.push({
         heading_style: "subtitle",
         type: "heading",
@@ -64,7 +44,23 @@ const processAreasForClimate = (
           navigation_path: `areas-${area.area_id}`,
         },
       });
-      cards.push(...areaCards);
+
+      if (area.temperature_entity_id) {
+        cards.push({
+          ...computeTileCard(area.temperature_entity_id),
+          features: [{ type: "history-chart" }],
+        });
+      }
+      if (area.humidity_entity_id) {
+        cards.push({
+          ...computeTileCard(area.humidity_entity_id),
+          features: [{ type: "history-chart" }],
+        });
+      }
+
+      for (const entityId of areaEntities) {
+        cards.push(computeTileCard(entityId));
+      }
     }
   }
 

src/panels/lovelace/strategies/home/home-lights-view-strategy.ts

@@ -32,15 +32,10 @@ const processAreasForLights = (
       area: area.area_id,
     });
     const areaLights = entities.filter(areaFilter);
-    const areaCards: LovelaceCardConfig[] = [];
 
     const computeTileCard = computeAreaTileCardConfig(hass, "", false);
 
-    for (const entityId of areaLights) {
-      areaCards.push(computeTileCard(entityId));
-    }
-
-    if (areaCards.length > 0) {
+    if (areaLights.length > 0) {
       cards.push({
         heading_style: "subtitle",
         type: "heading",
@@ -50,7 +45,10 @@ const processAreasForLights = (
           navigation_path: `areas-${area.area_id}`,
         },
       });
-      cards.push(...areaCards);
+
+      for (const entityId of areaLights) {
+        cards.push(computeTileCard(entityId));
+      }
     }
   }
 

src/panels/lovelace/strategies/home/home-media-players-view-strategy.ts

@@ -29,14 +29,6 @@ const processAreasForMediaPlayers = (
       area: area.area_id,
     });
     const areaEntities = entities.filter(areaFilter);
-    const areaCards: LovelaceCardConfig[] = [];
-
-    for (const entityId of areaEntities) {
-      cards.push({
-        type: "media-control",
-        entity: entityId,
-      } satisfies MediaControlCardConfig);
-    }
 
     if (areaEntities.length > 0) {
       cards.push({
@@ -48,7 +40,13 @@ const processAreasForMediaPlayers = (
           navigation_path: `areas-${area.area_id}`,
         },
       });
-      cards.push(...areaCards);
+
+      for (const entityId of areaEntities) {
+        cards.push({
+          type: "media-control",
+          entity: entityId,
+        } satisfies MediaControlCardConfig);
+      }
     }
   }
 

src/panels/lovelace/strategies/home/home-security-view-strategy.ts

@@ -12,7 +12,6 @@ import {
 } from "../areas/helpers/areas-strategy-helper";
 import { getHomeStructure } from "./helpers/home-structure";
 import { findEntities, HOME_SUMMARIES_FILTERS } from "./helpers/home-summaries";
-import type { LogbookCardConfig } from "../../cards/types";
 
 export interface HomeSecurityViewStrategyConfig {
   type: "home-security";
@@ -33,13 +32,7 @@ const processAreasForSecurity = (
     const areaFilter = generateEntityFilter(hass, {
       area: area.area_id,
     });
-
     const areaEntities = entities.filter(areaFilter);
-    const areaCards: LovelaceCardConfig[] = [];
-
-    for (const entityId of areaEntities) {
-      areaCards.push(computeTileCard(entityId));
-    }
 
     if (areaEntities.length > 0) {
       cards.push({
@@ -51,7 +44,10 @@ const processAreasForSecurity = (
           navigation_path: `areas-${area.area_id}`,
         },
       });
-      cards.push(...areaCards);
+
+      for (const entityId of areaEntities) {
+        cards.push(computeTileCard(entityId));
+      }
     }
   }
 
@@ -132,24 +128,6 @@ export class HomeSecurityViewStrategy extends ReactiveElement {
       }
     }
 
-    sections.push({
-      type: "grid",
-      cards: [
-        {
-          type: "heading",
-          heading: hass.localize("panel.logbook"),
-          tap_action: {
-            action: "navigate",
-            navigation_path: `/logbook?entity_id=${entities.join(",")}`,
-          },
-        },
-        {
-          type: "logbook",
-          target: { entity_id: entities },
-        } satisfies LogbookCardConfig,
-      ],
-    });
-
     return {
       type: "sections",
       max_columns: 2,

src/resources/theme/color/color.globals.ts

@@ -218,7 +218,6 @@ export const colorStyles = css`
     --table-row-alternative-background-color: var(--secondary-background-color);
     --data-table-background-color: var(--card-background-color);
     --markdown-code-background-color: var(--primary-background-color);
-    --bar-box-shadow: 0 2px 12px rgba(0, 0, 0, 0.16);
 
     /* https://github.com/material-components/material-web/blob/master/docs/theming.md */
     --mdc-theme-primary: var(--primary-color);
@@ -247,7 +246,6 @@ export const colorStyles = css`
     --mdc-dialog-scroll-divider-color: var(--divider-color);
     --mdc-dialog-heading-ink-color: var(--primary-text-color);
     --mdc-dialog-content-ink-color: var(--primary-text-color);
-    --mdc-top-app-bar-fixed-box-shadow: var(--bar-box-shadow);
 
     --mdc-text-field-idle-line-color: var(--input-idle-line-color);
     --mdc-text-field-hover-line-color: var(--input-hover-line-color);
@@ -362,8 +360,6 @@ export const darkColorStyles = css`
     --ha-button-warning-light-color: #917b54c1;
     --ha-button-neutral-color: #d9dae0;
     --ha-button-neutral-light-color: #6a7081;
-
-    --bar-box-shadow: 0 2px 12px rgba(0, 0, 0, 0.48);
   }
 `;
 

src/translations/en.json

@@ -5,7 +5,7 @@
     "config": "Settings",
     "states": "Overview",
     "map": "Map",
-    "logbook": "Logbook",
+    "logbook": "Activity",
     "history": "History",
     "todo": "To-do lists",
     "developer_tools": "Developer tools",
@@ -526,7 +526,7 @@
         }
       },
       "logbook": {
-        "entries_not_found": "No logbook events found.",
+        "entries_not_found": "No activity found.",
         "triggered_by": "triggered by",
         "triggered_by_automation": "triggered by automation",
         "triggered_by_script": "triggered by script",
@@ -539,7 +539,7 @@
         "triggered_by_homeassistant_stopping": "triggered by Home Assistant stopping",
         "triggered_by_homeassistant_starting": "triggered by Home Assistant starting",
         "show_trace": "[%key:ui::panel::config::automation::editor::show_trace%]",
-        "retrieval_error": "Could not load logbook",
+        "retrieval_error": "Could not load activity",
         "not_loaded": "[%key:ui::dialogs::helper_settings::platform_not_loaded%]",
         "messages": {
           "was_away": "was detected away",
@@ -1382,7 +1382,8 @@
         "info": "Information",
         "related": "Related",
         "history": "History",
-        "logbook": "Logbook",
+        "logbook": "Activity",
+        "device_info": "Device info",
         "device_or_service_info": "[%key:ui::panel::config::devices::device_info%]",
         "device_type": {
           "device": "[%key:ui::panel::config::devices::type::device_heading%]",
@@ -2039,13 +2040,11 @@
         "title": "Shortcuts",
         "enable_shortcuts_hint": "For keyboard shortcuts to work, make sure you have them enabled in your {user_profile}.",
         "enable_shortcuts_hint_user_profile": "user profile",
-        "keys": {
-          "del": "Del"
-        },
         "shortcuts": {
           "double_click": "Double-click",
           "scroll_wheel": "Scroll",
-          "drag": "Drag"
+          "drag": "Drag",
+          "ctrl_cmd": "Ctrl/Cmd"
         },
         "searching": {
           "title": "Searching",
@@ -2062,9 +2061,6 @@
         },
         "automation_script": {
           "title": "Automations / Scripts",
-          "copy": "to copy the selected item to clipboard",
-          "cut": "to cut the selected item and place it on the clipboard",
-          "delete": "to delete the selected item",
           "paste": "to paste automation/script YAML from clipboard to editor",
           "save": "to save automation/script"
         },
@@ -4595,7 +4591,7 @@
             "tabs": {
               "details": "Step details",
               "timeline": "Trace timeline",
-              "logbook": "Related logbook entries",
+              "logbook": "Related activity",
               "automation_config": "Automation config",
               "step_config": "Step config",
               "changed_variables": "Changed variables",
@@ -4612,7 +4608,7 @@
               "error": "Error: {error}",
               "result": "Result:",
               "step_not_executed": "This step was not executed.",
-              "no_logbook_entries": "No logbook entries found for this step.",
+              "no_logbook_entries": "No activity found for this step.",
               "no_variables_changed": "No variables changed",
               "unable_to_find_config": "Unable to find config"
             },
@@ -4638,8 +4634,8 @@
               "disabled": "(disabled)",
               "triggered_by": "{triggeredBy, select, \n alias {{alias} triggered}\n other {Triggered} \n} {triggeredPath, select, \n trigger {by the {trigger}}\n other {manually} \n} at {time}",
               "path_error": "Unable to extract path {path}. Download trace and report as bug.",
-              "not_all_entries_are_related_automation_note": "Not all shown logbook entries might be related to this automation.",
-              "not_all_entries_are_related_script_note": "Not all shown logbook entries might be related to this script."
+              "not_all_entries_are_related_automation_note": "Not all shown activity might be related to this automation.",
+              "not_all_entries_are_related_script_note": "Not all shown activity might be related to this script."
             }
           }
         },
@@ -5742,16 +5738,6 @@
           "no_advertisements_found": "No matching Bluetooth advertisements found",
           "no_connection_slot_allocations": "No connection slot allocations information available",
           "no_active_connection_support": "This adapter does not support making active (GATT) connections.",
-          "no_scanner_state_available": "No scanner state available",
-          "current_scanning_mode": "Current scanning mode",
-          "requested_scanning_mode": "Requested scanning mode",
-          "scanning_mode_none": "none",
-          "scanning_mode_active": "active",
-          "scanning_mode_passive": "passive",
-          "scanner_mode_mismatch": "Scanner requested {requested} mode but is operating in {current} mode. The scanner is in a bad state and needs to be power cycled.",
-          "scanner_mode_mismatch_remote": "For proxies: reboot the device",
-          "scanner_mode_mismatch_usb": "For USB adapters: unplug and plug back in",
-          "scanner_mode_mismatch_uart": "For UART/onboard adapters: power down the system completely and power it back up",
           "address": "Address",
           "name": "Name",
           "source": "Source",
@@ -7566,8 +7552,8 @@
               "square": "Render cards as squares"
             },
             "logbook": {
-              "name": "Logbook",
-              "description": "The Logbook card shows a list of events for entities."
+              "name": "Activity",
+              "description": "The Activity card shows a list of events for entities."
             },
             "history-graph": {
               "name": "History graph",
@@ -8208,8 +8194,8 @@
               "bar-gauge": {
                 "label": "Bar gauge"
               },
-              "trend-graph": {
-                "label": "Trend graph"
+              "history-chart": {
+                "label": "History chart"
               }
             }
           },

test/common/entity/device_tracker_icon.test.ts

@@ -1,124 +0,0 @@
-import type { HassEntity } from "home-assistant-js-websocket";
-import { describe, expect, it } from "vitest";
-import { deviceTrackerIcon } from "../../../src/common/entity/device_tracker_icon";
-
-describe("deviceTrackerIcon", () => {
-  const createMockStateObj = (
-    source_type: string,
-    state = "home"
-  ): HassEntity => ({
-    entity_id: "device_tracker.test",
-    state,
-    attributes: { source_type },
-    context: { id: "test", parent_id: null, user_id: null },
-    last_changed: "2023-01-01T00:00:00Z",
-    last_updated: "2023-01-01T00:00:00Z",
-  });
-
-  describe("router source type", () => {
-    it("should return lan-connect icon when home", () => {
-      const stateObj = createMockStateObj("router", "home");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:lan-connect");
-    });
-
-    it("should return lan-disconnect icon when not home", () => {
-      const stateObj = createMockStateObj("router", "not_home");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:lan-disconnect");
-    });
-
-    it("should return lan-disconnect icon for any other state", () => {
-      const stateObj = createMockStateObj("router", "office");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:lan-disconnect");
-    });
-
-    it("should use explicit state parameter over state object state", () => {
-      const stateObj = createMockStateObj("router", "not_home");
-      expect(deviceTrackerIcon(stateObj, "home")).toBe("mdi:lan-connect");
-    });
-  });
-
-  describe("bluetooth source type", () => {
-    it("should return bluetooth-connect icon when home for bluetooth", () => {
-      const stateObj = createMockStateObj("bluetooth", "home");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:bluetooth-connect");
-    });
-
-    it("should return bluetooth icon when not home for bluetooth", () => {
-      const stateObj = createMockStateObj("bluetooth", "not_home");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:bluetooth");
-    });
-
-    it("should return bluetooth-connect icon when home for bluetooth_le", () => {
-      const stateObj = createMockStateObj("bluetooth_le", "home");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:bluetooth-connect");
-    });
-
-    it("should return bluetooth icon when not home for bluetooth_le", () => {
-      const stateObj = createMockStateObj("bluetooth_le", "not_home");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:bluetooth");
-    });
-
-    it("should use explicit state parameter for bluetooth", () => {
-      const stateObj = createMockStateObj("bluetooth", "not_home");
-      expect(deviceTrackerIcon(stateObj, "home")).toBe("mdi:bluetooth-connect");
-    });
-  });
-
-  describe("other source types", () => {
-    it("should return account icon when home for gps", () => {
-      const stateObj = createMockStateObj("gps", "home");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:account");
-    });
-
-    it("should return account-arrow-right icon when not home for gps", () => {
-      const stateObj = createMockStateObj("gps", "not_home");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:account-arrow-right");
-    });
-
-    it("should return account icon for unknown location with gps", () => {
-      const stateObj = createMockStateObj("gps", "office");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:account");
-    });
-
-    it("should handle unknown source type", () => {
-      const stateObj = createMockStateObj("unknown", "home");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:account");
-    });
-
-    it("should handle unknown source type when not home", () => {
-      const stateObj = createMockStateObj("unknown", "not_home");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:account-arrow-right");
-    });
-  });
-
-  describe("edge cases", () => {
-    it("should handle missing source_type attribute", () => {
-      const stateObj: HassEntity = {
-        entity_id: "device_tracker.test",
-        state: "home",
-        attributes: {},
-        context: { id: "test", parent_id: null, user_id: null },
-        last_changed: "2023-01-01T00:00:00Z",
-        last_updated: "2023-01-01T00:00:00Z",
-      };
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:account");
-    });
-
-    it("should handle undefined state object attributes", () => {
-      const stateObj: HassEntity = {
-        entity_id: "device_tracker.test",
-        state: "not_home",
-        attributes: {},
-        context: { id: "test", parent_id: null, user_id: null },
-        last_changed: "2023-01-01T00:00:00Z",
-        last_updated: "2023-01-01T00:00:00Z",
-      };
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:account-arrow-right");
-    });
-
-    it("should handle empty string state", () => {
-      const stateObj = createMockStateObj("router", "");
-      expect(deviceTrackerIcon(stateObj)).toBe("mdi:lan-disconnect");
-    });
-  });
-});

test/common/entity/entity_filter.test.ts

@@ -1,391 +0,0 @@
-import { describe, expect, it } from "vitest";
-import { generateEntityFilter } from "../../../src/common/entity/entity_filter";
-import type { HomeAssistant } from "../../../src/types";
-
-// Mock HomeAssistant with comprehensive data
-const mockHass: HomeAssistant = {
-  states: {
-    "light.living_room": {
-      entity_id: "light.living_room",
-      state: "on",
-      attributes: { device_class: "light" },
-    },
-    "switch.kitchen": {
-      entity_id: "switch.kitchen",
-      state: "off",
-      attributes: { device_class: "switch" },
-    },
-    "sensor.temperature": {
-      entity_id: "sensor.temperature",
-      state: "22.5",
-      attributes: { device_class: "temperature" },
-    },
-    "binary_sensor.motion": {
-      entity_id: "binary_sensor.motion",
-      state: "off",
-      attributes: { device_class: "motion" },
-    },
-    "climate.thermostat": {
-      entity_id: "climate.thermostat",
-      state: "heat",
-      attributes: {},
-    },
-    "media_player.tv": {
-      entity_id: "media_player.tv",
-      state: "off",
-      attributes: {},
-    },
-    "light.bedroom": {
-      entity_id: "light.bedroom",
-      state: "off",
-      attributes: { device_class: "light" },
-    },
-    "switch.basement": {
-      entity_id: "switch.basement",
-      state: "on",
-      attributes: { device_class: "switch" },
-    },
-    "sensor.humidity": {
-      entity_id: "sensor.humidity",
-      state: "45",
-      attributes: { device_class: "humidity", entity_category: "diagnostic" },
-    },
-    "light.no_area": {
-      entity_id: "light.no_area",
-      state: "off",
-      attributes: { device_class: "light" },
-    },
-  } as any,
-  entities: {
-    "light.living_room": {
-      entity_id: "light.living_room",
-      device_id: "device1",
-      area_id: "living_room",
-      labels: [],
-    },
-    "switch.kitchen": {
-      entity_id: "switch.kitchen",
-      device_id: "device2",
-      area_id: "kitchen",
-      labels: [],
-    },
-    "sensor.temperature": {
-      entity_id: "sensor.temperature",
-      device_id: "device3",
-      area_id: "living_room",
-      labels: [],
-    },
-    "binary_sensor.motion": {
-      entity_id: "binary_sensor.motion",
-      device_id: "device4",
-      area_id: "hallway",
-      labels: [],
-    },
-    "climate.thermostat": {
-      entity_id: "climate.thermostat",
-      device_id: "device5",
-      area_id: "living_room",
-      labels: [],
-    },
-    "media_player.tv": {
-      entity_id: "media_player.tv",
-      device_id: "device6",
-      area_id: "living_room",
-      labels: [],
-    },
-    "light.bedroom": {
-      entity_id: "light.bedroom",
-      device_id: "device7",
-      area_id: "bedroom",
-      labels: [],
-    },
-    "switch.basement": {
-      entity_id: "switch.basement",
-      device_id: "device8",
-      area_id: "basement",
-      labels: [],
-    },
-    "sensor.humidity": {
-      entity_id: "sensor.humidity",
-      device_id: "device9",
-      area_id: "living_room",
-      entity_category: "diagnostic",
-      labels: ["climate", "monitoring"],
-    },
-    "light.no_area": {
-      entity_id: "light.no_area",
-      device_id: "device10",
-      labels: [],
-    },
-  } as any,
-  devices: {
-    device1: { id: "device1", area_id: "living_room" },
-    device2: { id: "device2", area_id: "kitchen" },
-    device3: { id: "device3", area_id: "living_room" },
-    device4: { id: "device4", area_id: "hallway" },
-    device5: { id: "device5", area_id: "living_room" },
-    device6: { id: "device6", area_id: "living_room" },
-    device7: { id: "device7", area_id: "bedroom" },
-    device8: { id: "device8", area_id: "basement" },
-    device9: { id: "device9", area_id: "living_room" },
-    device10: { id: "device10" }, // no area_id
-  } as any,
-  areas: {
-    living_room: {
-      area_id: "living_room",
-      name: "Living Room",
-      floor_id: "main_floor",
-    },
-    kitchen: { area_id: "kitchen", name: "Kitchen", floor_id: "main_floor" },
-    bedroom: { area_id: "bedroom", name: "Bedroom", floor_id: "upper_floor" },
-    basement: {
-      area_id: "basement",
-      name: "Basement",
-      floor_id: "basement_floor",
-    },
-    hallway: { area_id: "hallway", name: "Hallway", floor_id: "main_floor" },
-  } as any,
-  floors: {
-    main_floor: { floor_id: "main_floor", name: "Main Floor" },
-    upper_floor: { floor_id: "upper_floor", name: "Upper Floor" },
-    basement_floor: { floor_id: "basement_floor", name: "Basement Floor" },
-  } as any,
-} as HomeAssistant;
-
-describe("generateEntityFilter", () => {
-  describe("domain filtering", () => {
-    it("should filter entities by single domain", () => {
-      const filter = generateEntityFilter(mockHass, { domain: "light" });
-
-      expect(filter("light.living_room")).toBe(true);
-      expect(filter("switch.kitchen")).toBe(false);
-    });
-
-    it("should filter entities by multiple domains", () => {
-      const filter = generateEntityFilter(mockHass, {
-        domain: ["light", "switch"],
-      });
-
-      expect(filter("light.living_room")).toBe(true);
-      expect(filter("switch.kitchen")).toBe(true);
-      // Non-existent entities return false
-      expect(filter("switch.fan")).toBe(false);
-      expect(filter("sensor.temperature")).toBe(false);
-    });
-
-    it("should handle domain as string vs array", () => {
-      const singleFilter = generateEntityFilter(mockHass, { domain: "sensor" });
-      const arrayFilter = generateEntityFilter(mockHass, {
-        domain: ["sensor"],
-      });
-
-      expect(singleFilter("sensor.temperature")).toBe(true);
-      expect(arrayFilter("sensor.temperature")).toBe(true);
-      expect(singleFilter("light.living_room")).toBe(false);
-      expect(arrayFilter("light.living_room")).toBe(false);
-    });
-  });
-
-  describe("device class filtering", () => {
-    it("should filter entities by single device class", () => {
-      const filter = generateEntityFilter(mockHass, {
-        device_class: "temperature",
-      });
-
-      expect(filter("sensor.temperature")).toBe(true);
-      expect(filter("sensor.humidity")).toBe(false);
-    });
-
-    it("should filter entities by multiple device classes", () => {
-      const filter = generateEntityFilter(mockHass, {
-        device_class: ["temperature", "humidity"],
-      });
-
-      expect(filter("sensor.temperature")).toBe(true);
-      expect(filter("sensor.humidity")).toBe(true);
-      expect(filter("light.living_room")).toBe(false);
-    });
-
-    it("should handle entities without device class", () => {
-      const filter = generateEntityFilter(mockHass, { device_class: "test" });
-
-      expect(filter("climate.thermostat")).toBe(false);
-      expect(filter("media_player.tv")).toBe(false);
-    });
-  });
-
-  describe("area filtering", () => {
-    it("should filter entities by single area", () => {
-      const filter = generateEntityFilter(mockHass, { area: "living_room" });
-
-      expect(filter("light.living_room")).toBe(true);
-      expect(filter("sensor.temperature")).toBe(true);
-      expect(filter("switch.kitchen")).toBe(false);
-    });
-
-    it("should filter entities by multiple areas", () => {
-      const filter = generateEntityFilter(mockHass, {
-        area: ["living_room", "kitchen"],
-      });
-
-      expect(filter("light.living_room")).toBe(true);
-      expect(filter("switch.kitchen")).toBe(true);
-      expect(filter("light.bedroom")).toBe(false);
-    });
-  });
-
-  describe("floor filtering", () => {
-    // NOTE: The current implementation has a bug where it checks `if (!floors)` instead of `if (!floors.has(floor.floor_id))`
-    // So floor filtering will never actually filter by floor - it only checks if the entity has a floor at all
-    it("should filter entities by floor (tests current buggy behavior)", () => {
-      const filter = generateEntityFilter(mockHass, { floor: "main_floor" });
-
-      // Due to bug, all entities with floors pass (not just main_floor)
-      expect(filter("light.living_room")).toBe(true); // has floor
-      expect(filter("switch.kitchen")).toBe(true); // has floor
-      expect(filter("binary_sensor.motion")).toBe(true); // has floor
-      expect(filter("light.bedroom")).toBe(false); // wrong floor
-      expect(filter("switch.basement")).toBe(false); // wrong floor
-
-      // Entities without floors should fail
-      expect(filter("light.no_area")).toBe(false); // no area = no floor
-    });
-
-    it("should handle multiple floors (tests current buggy behavior)", () => {
-      const filter = generateEntityFilter(mockHass, {
-        floor: ["main_floor", "upper_floor"],
-      });
-
-      expect(filter("light.living_room")).toBe(true);
-      expect(filter("light.bedroom")).toBe(true);
-      expect(filter("switch.basement")).toBe(false);
-
-      // Entities without floors should fail
-      expect(filter("light.no_area")).toBe(false);
-    });
-  });
-
-  describe("device filtering", () => {
-    it("should filter entities by single device", () => {
-      const filter = generateEntityFilter(mockHass, { device: "device1" });
-
-      expect(filter("light.living_room")).toBe(true);
-      expect(filter("switch.kitchen")).toBe(false);
-    });
-
-    it("should filter entities by multiple devices", () => {
-      const filter = generateEntityFilter(mockHass, {
-        device: ["device1", "device2"],
-      });
-
-      expect(filter("light.living_room")).toBe(true);
-      expect(filter("switch.kitchen")).toBe(true);
-      expect(filter("sensor.temperature")).toBe(false);
-    });
-  });
-
-  describe("entity category filtering", () => {
-    it("should filter entities by entity category", () => {
-      const filter = generateEntityFilter(mockHass, {
-        entity_category: "diagnostic",
-      });
-
-      expect(filter("sensor.humidity")).toBe(true);
-      expect(filter("sensor.temperature")).toBe(false);
-    });
-
-    it("should filter entities with no entity category", () => {
-      const filter = generateEntityFilter(mockHass, {
-        entity_category: "none",
-      });
-
-      expect(filter("light.living_room")).toBe(true);
-      expect(filter("sensor.humidity")).toBe(false);
-    });
-  });
-
-  describe("label filtering", () => {
-    it("should filter entities by single label", () => {
-      const filter = generateEntityFilter(mockHass, { label: "climate" });
-
-      expect(filter("sensor.humidity")).toBe(true);
-      expect(filter("sensor.temperature")).toBe(false);
-    });
-
-    it("should filter entities by multiple labels", () => {
-      const filter = generateEntityFilter(mockHass, {
-        label: ["climate", "monitoring"],
-      });
-
-      expect(filter("sensor.humidity")).toBe(true);
-      expect(filter("light.living_room")).toBe(false);
-    });
-  });
-
-  describe("combined filtering", () => {
-    it("should combine multiple filter criteria with AND logic", () => {
-      const filter = generateEntityFilter(mockHass, {
-        domain: "light",
-        area: "living_room",
-      });
-
-      expect(filter("light.living_room")).toBe(true);
-      expect(filter("light.bedroom")).toBe(false);
-      expect(filter("sensor.temperature")).toBe(false);
-    });
-
-    it("should handle complex combinations", () => {
-      const filter = generateEntityFilter(mockHass, {
-        domain: ["sensor", "light"],
-        area: "living_room",
-        device_class: ["temperature", "light"],
-      });
-
-      expect(filter("sensor.temperature")).toBe(true);
-      expect(filter("light.living_room")).toBe(true);
-      expect(filter("sensor.humidity")).toBe(false); // wrong device class
-      expect(filter("light.bedroom")).toBe(false); // wrong area
-    });
-  });
-
-  describe("empty filter criteria", () => {
-    it("should handle empty filter criteria", () => {
-      const filter = generateEntityFilter(mockHass, {});
-
-      // Empty filter should pass all entities that exist in hass.states
-      expect(filter("light.living_room")).toBe(true);
-      expect(filter("switch.kitchen")).toBe(true);
-      expect(filter("nonexistent.entity")).toBe(false);
-    });
-
-    it("should handle empty domain array", () => {
-      const filter = generateEntityFilter(mockHass, { domain: [] });
-
-      // Empty domain array means no entities should pass domain filter
-      expect(filter("light.living_room")).toBe(false);
-      expect(filter("switch.kitchen")).toBe(false);
-    });
-  });
-
-  describe("edge cases", () => {
-    it("should handle non-existent entities", () => {
-      const filter = generateEntityFilter(mockHass, { domain: "light" });
-
-      expect(filter("light.nonexistent")).toBe(false);
-      expect(filter("invalid_entity_id")).toBe(false);
-    });
-
-    it("should handle entities without device or area assignments", () => {
-      const filter = generateEntityFilter(mockHass, { area: "living_room" });
-
-      expect(filter("light.no_area")).toBe(false);
-    });
-
-    it("should handle entities with device but no area", () => {
-      const filter = generateEntityFilter(mockHass, { area: "living_room" });
-
-      // light.no_area has device10 which has no area_id
-      expect(filter("light.no_area")).toBe(false);
-    });
-  });
-});

yarn.lock

@@ -1216,15 +1216,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@codemirror/autocomplete@npm:6.18.7":
-  version: 6.18.7
-  resolution: "@codemirror/autocomplete@npm:6.18.7"
+"@codemirror/autocomplete@npm:6.18.6":
+  version: 6.18.6
+  resolution: "@codemirror/autocomplete@npm:6.18.6"
   dependencies:
     "@codemirror/language": "npm:^6.0.0"
     "@codemirror/state": "npm:^6.0.0"
     "@codemirror/view": "npm:^6.17.0"
     "@lezer/common": "npm:^1.0.0"
-  checksum: 10/e50e3345d7d33e762d9abd2e6b1ea4ff54afe1630310464a5ddb42cab52fd5bac783ec0dc8a328cb746be6a7f9f711b6fcd8ef311af123511e8307b4c056cb9d
+  checksum: 10/0574d96fd04ccf2d3b7ae3c4efe0a72f423fa81658876ec50865ce3371cea038aeddf026976ec0d0ccbee72ac66bdf7deec9106dee251ad49019ae7e1a871663
   languageName: node
   linkType: hard
 
@@ -1283,15 +1283,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@codemirror/view@npm:6.38.2, @codemirror/view@npm:^6.0.0, @codemirror/view@npm:^6.17.0, @codemirror/view@npm:^6.23.0, @codemirror/view@npm:^6.27.0":
-  version: 6.38.2
-  resolution: "@codemirror/view@npm:6.38.2"
+"@codemirror/view@npm:6.38.1, @codemirror/view@npm:^6.0.0, @codemirror/view@npm:^6.17.0, @codemirror/view@npm:^6.23.0, @codemirror/view@npm:^6.27.0":
+  version: 6.38.1
+  resolution: "@codemirror/view@npm:6.38.1"
   dependencies:
     "@codemirror/state": "npm:^6.5.0"
     crelt: "npm:^1.0.6"
     style-mod: "npm:^4.1.0"
     w3c-keyname: "npm:^2.2.4"
-  checksum: 10/300608850a29215d7b47fe8ade183fc2241457a924335bd127e29e1af11da9314369c65ec0da968177086f3529abbcd71a609c1af673ea8951c32a523cab358c
+  checksum: 10/e0c5a365608749dd096ba7a930c8393f316bf4c2cacd1465a47a057d0a9f9868ff372a0bb6eb696c926f88411139f79a97a05f8c884bcc380145445cc61e68c8
   languageName: node
   linkType: hard
 
@@ -3990,92 +3990,92 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@rspack/binding-darwin-arm64@npm:1.5.2":
-  version: 1.5.2
-  resolution: "@rspack/binding-darwin-arm64@npm:1.5.2"
+"@rspack/binding-darwin-arm64@npm:1.5.1":
+  version: 1.5.1
+  resolution: "@rspack/binding-darwin-arm64@npm:1.5.1"
   conditions: os=darwin & cpu=arm64
   languageName: node
   linkType: hard
 
-"@rspack/binding-darwin-x64@npm:1.5.2":
-  version: 1.5.2
-  resolution: "@rspack/binding-darwin-x64@npm:1.5.2"
+"@rspack/binding-darwin-x64@npm:1.5.1":
+  version: 1.5.1
+  resolution: "@rspack/binding-darwin-x64@npm:1.5.1"
   conditions: os=darwin & cpu=x64
   languageName: node
   linkType: hard
 
-"@rspack/binding-linux-arm64-gnu@npm:1.5.2":
-  version: 1.5.2
-  resolution: "@rspack/binding-linux-arm64-gnu@npm:1.5.2"
+"@rspack/binding-linux-arm64-gnu@npm:1.5.1":
+  version: 1.5.1
+  resolution: "@rspack/binding-linux-arm64-gnu@npm:1.5.1"
   conditions: os=linux & cpu=arm64 & libc=glibc
   languageName: node
   linkType: hard
 
-"@rspack/binding-linux-arm64-musl@npm:1.5.2":
-  version: 1.5.2
-  resolution: "@rspack/binding-linux-arm64-musl@npm:1.5.2"
+"@rspack/binding-linux-arm64-musl@npm:1.5.1":
+  version: 1.5.1
+  resolution: "@rspack/binding-linux-arm64-musl@npm:1.5.1"
   conditions: os=linux & cpu=arm64 & libc=musl
   languageName: node
   linkType: hard
 
-"@rspack/binding-linux-x64-gnu@npm:1.5.2":
-  version: 1.5.2
-  resolution: "@rspack/binding-linux-x64-gnu@npm:1.5.2"
+"@rspack/binding-linux-x64-gnu@npm:1.5.1":
+  version: 1.5.1
+  resolution: "@rspack/binding-linux-x64-gnu@npm:1.5.1"
   conditions: os=linux & cpu=x64 & libc=glibc
   languageName: node
   linkType: hard
 
-"@rspack/binding-linux-x64-musl@npm:1.5.2":
-  version: 1.5.2
-  resolution: "@rspack/binding-linux-x64-musl@npm:1.5.2"
+"@rspack/binding-linux-x64-musl@npm:1.5.1":
+  version: 1.5.1
+  resolution: "@rspack/binding-linux-x64-musl@npm:1.5.1"
   conditions: os=linux & cpu=x64 & libc=musl
   languageName: node
   linkType: hard
 
-"@rspack/binding-wasm32-wasi@npm:1.5.2":
-  version: 1.5.2
-  resolution: "@rspack/binding-wasm32-wasi@npm:1.5.2"
+"@rspack/binding-wasm32-wasi@npm:1.5.1":
+  version: 1.5.1
+  resolution: "@rspack/binding-wasm32-wasi@npm:1.5.1"
   dependencies:
     "@napi-rs/wasm-runtime": "npm:^1.0.1"
   conditions: cpu=wasm32
   languageName: node
   linkType: hard
 
-"@rspack/binding-win32-arm64-msvc@npm:1.5.2":
-  version: 1.5.2
-  resolution: "@rspack/binding-win32-arm64-msvc@npm:1.5.2"
+"@rspack/binding-win32-arm64-msvc@npm:1.5.1":
+  version: 1.5.1
+  resolution: "@rspack/binding-win32-arm64-msvc@npm:1.5.1"
   conditions: os=win32 & cpu=arm64
   languageName: node
   linkType: hard
 
-"@rspack/binding-win32-ia32-msvc@npm:1.5.2":
-  version: 1.5.2
-  resolution: "@rspack/binding-win32-ia32-msvc@npm:1.5.2"
+"@rspack/binding-win32-ia32-msvc@npm:1.5.1":
+  version: 1.5.1
+  resolution: "@rspack/binding-win32-ia32-msvc@npm:1.5.1"
   conditions: os=win32 & cpu=ia32
   languageName: node
   linkType: hard
 
-"@rspack/binding-win32-x64-msvc@npm:1.5.2":
-  version: 1.5.2
-  resolution: "@rspack/binding-win32-x64-msvc@npm:1.5.2"
+"@rspack/binding-win32-x64-msvc@npm:1.5.1":
+  version: 1.5.1
+  resolution: "@rspack/binding-win32-x64-msvc@npm:1.5.1"
   conditions: os=win32 & cpu=x64
   languageName: node
   linkType: hard
 
-"@rspack/binding@npm:1.5.2":
-  version: 1.5.2
-  resolution: "@rspack/binding@npm:1.5.2"
+"@rspack/binding@npm:1.5.1":
+  version: 1.5.1
+  resolution: "@rspack/binding@npm:1.5.1"
   dependencies:
-    "@rspack/binding-darwin-arm64": "npm:1.5.2"
-    "@rspack/binding-darwin-x64": "npm:1.5.2"
-    "@rspack/binding-linux-arm64-gnu": "npm:1.5.2"
-    "@rspack/binding-linux-arm64-musl": "npm:1.5.2"
-    "@rspack/binding-linux-x64-gnu": "npm:1.5.2"
-    "@rspack/binding-linux-x64-musl": "npm:1.5.2"
-    "@rspack/binding-wasm32-wasi": "npm:1.5.2"
-    "@rspack/binding-win32-arm64-msvc": "npm:1.5.2"
-    "@rspack/binding-win32-ia32-msvc": "npm:1.5.2"
-    "@rspack/binding-win32-x64-msvc": "npm:1.5.2"
+    "@rspack/binding-darwin-arm64": "npm:1.5.1"
+    "@rspack/binding-darwin-x64": "npm:1.5.1"
+    "@rspack/binding-linux-arm64-gnu": "npm:1.5.1"
+    "@rspack/binding-linux-arm64-musl": "npm:1.5.1"
+    "@rspack/binding-linux-x64-gnu": "npm:1.5.1"
+    "@rspack/binding-linux-x64-musl": "npm:1.5.1"
+    "@rspack/binding-wasm32-wasi": "npm:1.5.1"
+    "@rspack/binding-win32-arm64-msvc": "npm:1.5.1"
+    "@rspack/binding-win32-ia32-msvc": "npm:1.5.1"
+    "@rspack/binding-win32-x64-msvc": "npm:1.5.1"
   dependenciesMeta:
     "@rspack/binding-darwin-arm64":
       optional: true
@@ -4097,23 +4097,23 @@ __metadata:
       optional: true
     "@rspack/binding-win32-x64-msvc":
       optional: true
-  checksum: 10/71c41c6c878445ea561b7a02d9f75ec13ce170f5d63053debd72dee82a07d23c491a55526cfe9e0aceb5ee1154a07bbe69121deb2821d1a3ac5021eea75d9114
+  checksum: 10/a6756a35bda55fd9e21b1ce142ca18e228d92832dc213027a19314981f8f12e6510dd862a9724ee96dee61755b3dd30ce73b2bb117d150e9f5ce73ba8fe4b57a
   languageName: node
   linkType: hard
 
-"@rspack/core@npm:1.5.2":
-  version: 1.5.2
-  resolution: "@rspack/core@npm:1.5.2"
+"@rspack/core@npm:1.5.1":
+  version: 1.5.1
+  resolution: "@rspack/core@npm:1.5.1"
   dependencies:
     "@module-federation/runtime-tools": "npm:0.18.0"
-    "@rspack/binding": "npm:1.5.2"
+    "@rspack/binding": "npm:1.5.1"
     "@rspack/lite-tapable": "npm:1.0.1"
   peerDependencies:
     "@swc/helpers": ">=0.5.1"
   peerDependenciesMeta:
     "@swc/helpers":
       optional: true
-  checksum: 10/e72023c8eea0ed351d950a28b6897ca7143ad749a65380ab855e12f96f8ce692ab044c14acf9b030bca740b722c197ad3075eaadac4fe480389e3131c519ac0e
+  checksum: 10/b7a6269d5bdbcad140d172ebe951f4693711573d4f38e4c676c250a9cc6c1bdf602ad5187eeacc07ff12b74d510b746c92e3f112c8ab4dca46846c595d2876b0
   languageName: node
   linkType: hard
 
@@ -4496,10 +4496,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/culori@npm:4.0.1":
-  version: 4.0.1
-  resolution: "@types/culori@npm:4.0.1"
-  checksum: 10/34240fce795cdcbeefbbb4ec1fd6adec1c7edafa949131586176649c21d912236d151bf7af53de161454a6c2fa259a4ddd54f204c66e67e8b9ecfd90b9021c68
+"@types/culori@npm:4.0.0":
+  version: 4.0.0
+  resolution: "@types/culori@npm:4.0.0"
+  checksum: 10/62a9058d6125fe489ca1e7df27ac9837ea7a34c772b8bed8e5e00177b141574830efaa0c93363e9532878490d3245a9c9c8183ebee181a450097584af0cfefc1
   languageName: node
   linkType: hard
 
@@ -4685,25 +4685,25 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/leaflet-draw@npm:1.0.13":
-  version: 1.0.13
-  resolution: "@types/leaflet-draw@npm:1.0.13"
+"@types/leaflet-draw@npm:1.0.12":
+  version: 1.0.12
+  resolution: "@types/leaflet-draw@npm:1.0.12"
   dependencies:
-    "@types/leaflet": "npm:^1.9"
-  checksum: 10/1a6c3a8b3011f15362108b522fa6d17cca888a7f866e2e582dac921e2c748d9e24685d83b2a5ed1d97e3a1448b0f5b1879a42f1143ffdeb36b71c7fb9b94e9f5
+    "@types/leaflet": "npm:*"
+  checksum: 10/2a73a152e6a9405502789d7b2d8ffe18d679da03533e17c2a1fe722e78c8ed8cf3daf6a56aae5572c4dd86257811286b5e06b0cb307141a241618f33a360618a
   languageName: node
   linkType: hard
 
-"@types/leaflet.markercluster@npm:1.5.6":
-  version: 1.5.6
-  resolution: "@types/leaflet.markercluster@npm:1.5.6"
+"@types/leaflet.markercluster@npm:1.5.5":
+  version: 1.5.5
+  resolution: "@types/leaflet.markercluster@npm:1.5.5"
   dependencies:
-    "@types/leaflet": "npm:^1.9"
-  checksum: 10/6ddc628fa6d8a3735f154418115b8b0225fefc74d1d472d0aa987a945a92ed6e0dcc0bcaad5a65d104f38e7445cddbf91d75de97b970b6d173e43afa373d8761
+    "@types/leaflet": "npm:*"
+  checksum: 10/17647d187ed8c9c38124005c3c45c0c7998c6359d8783e2ea162f9649b151862750c813eba2373054e90156a11a37af2b220429f937b302889b9d6e2105bf2ca
   languageName: node
   linkType: hard
 
-"@types/leaflet@npm:1.9.20, @types/leaflet@npm:^1.9":
+"@types/leaflet@npm:*, @types/leaflet@npm:1.9.20":
   version: 1.9.20
   resolution: "@types/leaflet@npm:1.9.20"
   dependencies:
@@ -4964,106 +4964,106 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@typescript-eslint/eslint-plugin@npm:8.42.0":
-  version: 8.42.0
-  resolution: "@typescript-eslint/eslint-plugin@npm:8.42.0"
+"@typescript-eslint/eslint-plugin@npm:8.41.0":
+  version: 8.41.0
+  resolution: "@typescript-eslint/eslint-plugin@npm:8.41.0"
   dependencies:
     "@eslint-community/regexpp": "npm:^4.10.0"
-    "@typescript-eslint/scope-manager": "npm:8.42.0"
-    "@typescript-eslint/type-utils": "npm:8.42.0"
-    "@typescript-eslint/utils": "npm:8.42.0"
-    "@typescript-eslint/visitor-keys": "npm:8.42.0"
+    "@typescript-eslint/scope-manager": "npm:8.41.0"
+    "@typescript-eslint/type-utils": "npm:8.41.0"
+    "@typescript-eslint/utils": "npm:8.41.0"
+    "@typescript-eslint/visitor-keys": "npm:8.41.0"
     graphemer: "npm:^1.4.0"
     ignore: "npm:^7.0.0"
     natural-compare: "npm:^1.4.0"
     ts-api-utils: "npm:^2.1.0"
   peerDependencies:
-    "@typescript-eslint/parser": ^8.42.0
+    "@typescript-eslint/parser": ^8.41.0
     eslint: ^8.57.0 || ^9.0.0
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/fb5b0e0785f9fa9d5ef88e78ff189334b2d1c558efd7b5063508d50275224a8aa38d4af0478228b90d6be6620289384a8d814f05e0af8c952c204515c0f3514e
+  checksum: 10/b96e3fd9e8ae2c289aa7f1c0d2fbf89c608d37f54162a893bac5895318b05d21d3fd456cf7a6adf165915a8212f773f1bae9b4d83f732441864f6d92d083ed99
   languageName: node
   linkType: hard
 
-"@typescript-eslint/parser@npm:8.42.0":
-  version: 8.42.0
-  resolution: "@typescript-eslint/parser@npm:8.42.0"
+"@typescript-eslint/parser@npm:8.41.0":
+  version: 8.41.0
+  resolution: "@typescript-eslint/parser@npm:8.41.0"
   dependencies:
-    "@typescript-eslint/scope-manager": "npm:8.42.0"
-    "@typescript-eslint/types": "npm:8.42.0"
-    "@typescript-eslint/typescript-estree": "npm:8.42.0"
-    "@typescript-eslint/visitor-keys": "npm:8.42.0"
+    "@typescript-eslint/scope-manager": "npm:8.41.0"
+    "@typescript-eslint/types": "npm:8.41.0"
+    "@typescript-eslint/typescript-estree": "npm:8.41.0"
+    "@typescript-eslint/visitor-keys": "npm:8.41.0"
     debug: "npm:^4.3.4"
   peerDependencies:
     eslint: ^8.57.0 || ^9.0.0
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/25eb2d08c118742dc01c2aa279ea4ba2d277e2d9a042ffd4f9bda9e94d7ff2aa90b63aad1204a82617a5c63ddd3dd553d927944cd9c8345826484d0d523cf7ad
+  checksum: 10/d4ba418aa62e08d49a5b953c9debd52674c30b9b2bb7bf2efc173a22ad3942df72cd83072beac06d98dad82741baf502a55fc648925ca407b01abdc908675f67
   languageName: node
   linkType: hard
 
-"@typescript-eslint/project-service@npm:8.42.0":
-  version: 8.42.0
-  resolution: "@typescript-eslint/project-service@npm:8.42.0"
+"@typescript-eslint/project-service@npm:8.41.0":
+  version: 8.41.0
+  resolution: "@typescript-eslint/project-service@npm:8.41.0"
   dependencies:
-    "@typescript-eslint/tsconfig-utils": "npm:^8.42.0"
-    "@typescript-eslint/types": "npm:^8.42.0"
+    "@typescript-eslint/tsconfig-utils": "npm:^8.41.0"
+    "@typescript-eslint/types": "npm:^8.41.0"
     debug: "npm:^4.3.4"
   peerDependencies:
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/3e91fd4b4d60edd6fe3e108e8e75947de8aa060aab1de63c23017e8afeca72ef405faa6fcdd17e8aa0023261a81135d095072dc31343c57395e50450258d9fa5
+  checksum: 10/ff8315de005ea7072ecd208b50b35fa01db034f110f30f415faa9c9441648494e5322723a0a4267beb28524babd6b04b349c32f2a2821f4ae0e9c4d503e1e8f0
   languageName: node
   linkType: hard
 
-"@typescript-eslint/scope-manager@npm:8.42.0":
-  version: 8.42.0
-  resolution: "@typescript-eslint/scope-manager@npm:8.42.0"
+"@typescript-eslint/scope-manager@npm:8.41.0":
+  version: 8.41.0
+  resolution: "@typescript-eslint/scope-manager@npm:8.41.0"
   dependencies:
-    "@typescript-eslint/types": "npm:8.42.0"
-    "@typescript-eslint/visitor-keys": "npm:8.42.0"
-  checksum: 10/81be2d908a9d2d83bc9fe5e9219b04277b9fa466bfa7faf45dc076e4b33b39db2fb99b34b8832e329c7db48ddfdc7b78f6c92b564cd6eec99e124d3feaad8645
+    "@typescript-eslint/types": "npm:8.41.0"
+    "@typescript-eslint/visitor-keys": "npm:8.41.0"
+  checksum: 10/4fc1dd6b3390d3a770c228dac227f35ff1126034fce484ab5e5a4fdbe2dab5dca1c8de3c528708320fee021adec1a1260ee45ed2aef9f7e3fdfbb1faf2191f9f
   languageName: node
   linkType: hard
 
-"@typescript-eslint/tsconfig-utils@npm:8.42.0, @typescript-eslint/tsconfig-utils@npm:^8.42.0":
-  version: 8.42.0
-  resolution: "@typescript-eslint/tsconfig-utils@npm:8.42.0"
+"@typescript-eslint/tsconfig-utils@npm:8.41.0, @typescript-eslint/tsconfig-utils@npm:^8.41.0":
+  version: 8.41.0
+  resolution: "@typescript-eslint/tsconfig-utils@npm:8.41.0"
   peerDependencies:
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/927aa127983a62ddcbfbcd18806fd278e0bf18fade3cca658946f9ff4915e6a5c5cc85926afaa490512c88dd2950b2059f22b50b6d1f4461c9dbd755a4c71c1c
+  checksum: 10/522d54252f9647d22e46f963df6bafe98aa0572b021e6acf7474c40f1a68afa6753f23a0a125abb1d792a89a1b1cc654d918553a03d08f769139f2f40b0d026c
   languageName: node
   linkType: hard
 
-"@typescript-eslint/type-utils@npm:8.42.0":
-  version: 8.42.0
-  resolution: "@typescript-eslint/type-utils@npm:8.42.0"
+"@typescript-eslint/type-utils@npm:8.41.0":
+  version: 8.41.0
+  resolution: "@typescript-eslint/type-utils@npm:8.41.0"
   dependencies:
-    "@typescript-eslint/types": "npm:8.42.0"
-    "@typescript-eslint/typescript-estree": "npm:8.42.0"
-    "@typescript-eslint/utils": "npm:8.42.0"
+    "@typescript-eslint/types": "npm:8.41.0"
+    "@typescript-eslint/typescript-estree": "npm:8.41.0"
+    "@typescript-eslint/utils": "npm:8.41.0"
     debug: "npm:^4.3.4"
     ts-api-utils: "npm:^2.1.0"
   peerDependencies:
     eslint: ^8.57.0 || ^9.0.0
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/8d876bbd23c956b604d973c49720060c251f4d8cab255f1fd04826a9a1e3ab7c1310400d49d9ec6cdac3288d7a23cd9fb48d42777651ba53c02b5e1a34efd6e9
+  checksum: 10/6c4c693c1ee3d1a1a3635898d59f1a3bcdf224be84284ea95a21fa68a3206bae32ce04d371df366fcad250a3eca3af723ed6ca1b4aefba238d4e553797c2dc9d
   languageName: node
   linkType: hard
 
-"@typescript-eslint/types@npm:8.42.0, @typescript-eslint/types@npm:^8.42.0":
-  version: 8.42.0
-  resolution: "@typescript-eslint/types@npm:8.42.0"
-  checksum: 10/7c39a35e5bb7083070872edc797ea60a3d6ceff0e3bdf85701919b71da83a51963562053a4b35c9e2a2b08c138fb595e14bc0b5c450e671a26059b58f8d8b4f4
+"@typescript-eslint/types@npm:8.41.0, @typescript-eslint/types@npm:^8.41.0":
+  version: 8.41.0
+  resolution: "@typescript-eslint/types@npm:8.41.0"
+  checksum: 10/e2fe5d9125264a1b1310fff7ac65e827da9885219d7f910dba090dcf7d4242830cb96695c7257634b22e1947943a2e890f9740536d95612452e5752385ab6a5b
   languageName: node
   linkType: hard
 
-"@typescript-eslint/typescript-estree@npm:8.42.0":
-  version: 8.42.0
-  resolution: "@typescript-eslint/typescript-estree@npm:8.42.0"
+"@typescript-eslint/typescript-estree@npm:8.41.0":
+  version: 8.41.0
+  resolution: "@typescript-eslint/typescript-estree@npm:8.41.0"
   dependencies:
-    "@typescript-eslint/project-service": "npm:8.42.0"
-    "@typescript-eslint/tsconfig-utils": "npm:8.42.0"
-    "@typescript-eslint/types": "npm:8.42.0"
-    "@typescript-eslint/visitor-keys": "npm:8.42.0"
+    "@typescript-eslint/project-service": "npm:8.41.0"
+    "@typescript-eslint/tsconfig-utils": "npm:8.41.0"
+    "@typescript-eslint/types": "npm:8.41.0"
+    "@typescript-eslint/visitor-keys": "npm:8.41.0"
     debug: "npm:^4.3.4"
     fast-glob: "npm:^3.3.2"
     is-glob: "npm:^4.0.3"
@@ -5072,32 +5072,32 @@ __metadata:
     ts-api-utils: "npm:^2.1.0"
   peerDependencies:
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/9bb5df97a2ac31e6e3ee6941e10702498a76d23235ba28a23d93e09aa75a2cbcd40dc74935d86706c8e2e55e1a8b6a34bb9fb234461920ed3d8a5abed68ba36b
+  checksum: 10/e039815d2ee03727fadb32c460e0c7df71a35b6c93a87e019c63836c53e51ce41f1975b32c9e5bcc840f4cd49c7bf7715c95df149f915379ec4c559d02436623
   languageName: node
   linkType: hard
 
-"@typescript-eslint/utils@npm:8.42.0":
-  version: 8.42.0
-  resolution: "@typescript-eslint/utils@npm:8.42.0"
+"@typescript-eslint/utils@npm:8.41.0":
+  version: 8.41.0
+  resolution: "@typescript-eslint/utils@npm:8.41.0"
   dependencies:
     "@eslint-community/eslint-utils": "npm:^4.7.0"
-    "@typescript-eslint/scope-manager": "npm:8.42.0"
-    "@typescript-eslint/types": "npm:8.42.0"
-    "@typescript-eslint/typescript-estree": "npm:8.42.0"
+    "@typescript-eslint/scope-manager": "npm:8.41.0"
+    "@typescript-eslint/types": "npm:8.41.0"
+    "@typescript-eslint/typescript-estree": "npm:8.41.0"
   peerDependencies:
     eslint: ^8.57.0 || ^9.0.0
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/41c6c0d01c414c94d7109e21deee73b416547b3be26240d0237a3004c6198f146afefc75feee5333bc957ece6a0856518750655e794fd68c96feec1001edbfe8
+  checksum: 10/863565c0891d89ee27497571092783a7fa90e281a7643f1bda5d9e8b94aea2acbc851e81141ce7a53ddea3638a0527ea165801dd9611f5532940e4d413c955a8
   languageName: node
   linkType: hard
 
-"@typescript-eslint/visitor-keys@npm:8.42.0":
-  version: 8.42.0
-  resolution: "@typescript-eslint/visitor-keys@npm:8.42.0"
+"@typescript-eslint/visitor-keys@npm:8.41.0":
+  version: 8.41.0
+  resolution: "@typescript-eslint/visitor-keys@npm:8.41.0"
   dependencies:
-    "@typescript-eslint/types": "npm:8.42.0"
+    "@typescript-eslint/types": "npm:8.41.0"
     eslint-visitor-keys: "npm:^4.2.1"
-  checksum: 10/ef3aeabf7b01eb72e176053a4fe7a4c4f0769a9f58d1f7a920c97d365305b950c402ad34227209781996ae187652ccf0f47c31015f992c502b5fa898a9d44bd5
+  checksum: 10/3c764be2f0d3b212c2cb7d0cc8a7b0ed378feb58883654471fd8ee943f1e124c0b78df92fe14368ceb46016b0e3ae1c47e2630ec3599aa7b4bd54f7793747657
   languageName: node
   linkType: hard
 
@@ -6561,7 +6561,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"chalk@npm:^5.0.1, chalk@npm:^5.6.0":
+"chalk@npm:^5.0.1, chalk@npm:^5.5.0":
   version: 5.6.0
   resolution: "chalk@npm:5.6.0"
   checksum: 10/f0e0646a72adbd0f6e73441d3872d7f2f40ba98052924f08a30c10634ec6b1e2cd19cc3c40cc21081dad640e2a1a2749030418571690b89bd7782babf7f89866
@@ -9317,13 +9317,13 @@ __metadata:
     "@babel/runtime": "npm:7.28.3"
     "@braintree/sanitize-url": "npm:7.1.1"
     "@bundle-stats/plugin-webpack-filter": "npm:4.21.3"
-    "@codemirror/autocomplete": "npm:6.18.7"
+    "@codemirror/autocomplete": "npm:6.18.6"
     "@codemirror/commands": "npm:6.8.1"
     "@codemirror/language": "npm:6.11.3"
     "@codemirror/legacy-modes": "npm:6.5.1"
     "@codemirror/search": "npm:6.5.11"
     "@codemirror/state": "npm:6.5.2"
-    "@codemirror/view": "npm:6.38.2"
+    "@codemirror/view": "npm:6.38.1"
     "@egjs/hammerjs": "npm:2.0.17"
     "@formatjs/intl-datetimeformat": "npm:6.18.0"
     "@formatjs/intl-displaynames": "npm:6.8.11"
@@ -9377,7 +9377,7 @@ __metadata:
     "@octokit/rest": "npm:22.0.0"
     "@replit/codemirror-indentation-markers": "npm:6.5.3"
     "@rsdoctor/rspack-plugin": "npm:1.2.3"
-    "@rspack/core": "npm:1.5.2"
+    "@rspack/core": "npm:1.5.1"
     "@rspack/dev-server": "npm:1.1.4"
     "@shoelace-style/shoelace": "npm:2.20.1"
     "@swc/helpers": "npm:0.5.17"
@@ -9388,12 +9388,12 @@ __metadata:
     "@types/chromecast-caf-receiver": "npm:6.0.24"
     "@types/chromecast-caf-sender": "npm:1.0.11"
     "@types/color-name": "npm:2.0.0"
-    "@types/culori": "npm:4.0.1"
+    "@types/culori": "npm:4.0.0"
     "@types/html-minifier-terser": "npm:7.0.2"
     "@types/js-yaml": "npm:4.0.9"
     "@types/leaflet": "npm:1.9.20"
-    "@types/leaflet-draw": "npm:1.0.13"
-    "@types/leaflet.markercluster": "npm:1.5.6"
+    "@types/leaflet-draw": "npm:1.0.12"
+    "@types/leaflet.markercluster": "npm:1.5.5"
     "@types/lodash.merge": "npm:4.6.9"
     "@types/luxon": "npm:3.7.1"
     "@types/mocha": "npm:10.0.10"
@@ -9458,7 +9458,7 @@ __metadata:
     leaflet: "npm:1.9.4"
     leaflet-draw: "patch:leaflet-draw@npm%3A1.0.4#./.yarn/patches/leaflet-draw-npm-1.0.4-0ca0ebcf65.patch"
     leaflet.markercluster: "npm:1.5.3"
-    lint-staged: "npm:16.1.6"
+    lint-staged: "npm:16.1.5"
     lit: "npm:3.3.1"
     lit-analyzer: "npm:2.0.3"
     lit-html: "npm:3.3.1"
@@ -9488,7 +9488,7 @@ __metadata:
     tinykeys: "npm:3.0.0"
     ts-lit-plugin: "npm:2.0.2"
     typescript: "npm:5.9.2"
-    typescript-eslint: "npm:8.42.0"
+    typescript-eslint: "npm:8.41.0"
     ua-parser-js: "npm:2.0.4"
     vite-tsconfig-paths: "npm:5.1.4"
     vitest: "npm:3.2.4"
@@ -10826,15 +10826,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"lint-staged@npm:16.1.6":
-  version: 16.1.6
-  resolution: "lint-staged@npm:16.1.6"
+"lint-staged@npm:16.1.5":
+  version: 16.1.5
+  resolution: "lint-staged@npm:16.1.5"
   dependencies:
-    chalk: "npm:^5.6.0"
+    chalk: "npm:^5.5.0"
     commander: "npm:^14.0.0"
     debug: "npm:^4.4.1"
     lilconfig: "npm:^3.1.3"
-    listr2: "npm:^9.0.3"
+    listr2: "npm:^9.0.1"
     micromatch: "npm:^4.0.8"
     nano-spawn: "npm:^1.0.2"
     pidtree: "npm:^0.6.0"
@@ -10842,13 +10842,13 @@ __metadata:
     yaml: "npm:^2.8.1"
   bin:
     lint-staged: bin/lint-staged.js
-  checksum: 10/922b4392ae5d3d56130e4eba706c2fa6151d5da5e21f57ab601b1d6ce9cc635ceb5e4c3dc00e7da83ba8f0cb244b82604469c7ea1470b1e6b6ea0fc12454aa08
+  checksum: 10/02b284f89d7b8118e1b27b1f2068017ed84407e57a1166463789caa65f3429f206372c483bc37304ce03dcb30bd1dd3e624f0502ae4973d440fe73cdd04e0747
   languageName: node
   linkType: hard
 
-"listr2@npm:^9.0.3":
-  version: 9.0.3
-  resolution: "listr2@npm:9.0.3"
+"listr2@npm:^9.0.1":
+  version: 9.0.1
+  resolution: "listr2@npm:9.0.1"
   dependencies:
     cli-truncate: "npm:^4.0.0"
     colorette: "npm:^2.0.20"
@@ -10856,7 +10856,7 @@ __metadata:
     log-update: "npm:^6.1.0"
     rfdc: "npm:^1.4.1"
     wrap-ansi: "npm:^9.0.0"
-  checksum: 10/8cb7cd1cec0f4360502c14cd54af948f831134811d84d3fd2b38b2fa11ea66ee0b15ca8b00b8088d28d7381031afbe755ee3f46bc2c03c2c96c433f04296bd44
+  checksum: 10/ac5f98317fe17588d304bb4dce47ea22892f223511948656f588c5ab47b99d5d97ca4b812b4fb1237db8ec8d86a504875d8d6a0bb24c877553537eab44941983
   languageName: node
   linkType: hard
 
@@ -14527,18 +14527,18 @@ __metadata:
   languageName: node
   linkType: hard
 
-"typescript-eslint@npm:8.42.0":
-  version: 8.42.0
-  resolution: "typescript-eslint@npm:8.42.0"
+"typescript-eslint@npm:8.41.0":
+  version: 8.41.0
+  resolution: "typescript-eslint@npm:8.41.0"
   dependencies:
-    "@typescript-eslint/eslint-plugin": "npm:8.42.0"
-    "@typescript-eslint/parser": "npm:8.42.0"
-    "@typescript-eslint/typescript-estree": "npm:8.42.0"
-    "@typescript-eslint/utils": "npm:8.42.0"
+    "@typescript-eslint/eslint-plugin": "npm:8.41.0"
+    "@typescript-eslint/parser": "npm:8.41.0"
+    "@typescript-eslint/typescript-estree": "npm:8.41.0"
+    "@typescript-eslint/utils": "npm:8.41.0"
   peerDependencies:
     eslint: ^8.57.0 || ^9.0.0
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/7f71501823b2c1e87e89ff00d6d8eb40c7514630dbb6b7b44c4dd830c95709357270763df2d711a8ea7bb0b58bd69534f15b01db4550dc6e745df8fec8f6a3ae
+  checksum: 10/a398a367b3a674bcdb74f060e0b06aacb9e8bd0637079c5079ff66a43a35286098b97d71fca1b81b738c0df840fda4b53aeee03ed0aacef03f9644c61a68960e
   languageName: node
   linkType: hard