Fix chart down sampling collapsing the series when the chart is hidden

Add a home page demo to the demo (#53311 )
* Fix mocked entity states and demo config switching Three small demo/mock fixes: - Mocked entities dropped unit_of_measurement and state_class when writing to the state machine, so demo sensors rendered without a unit and the mocked history returned a single state for them - The energy consumption sensor entity id had a stray tab, which fails entity id validation in cards that render it - Switching demos saved the dashboard config before the new registries and entities reached the dashboard, so dashboard strategies generated against the previous data Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01KZ6ydA22VeQndgynH4SxCV * Add a home page demo to the demo Adds the home page as the second demo, generated by the real home dashboard strategies instead of a copy, so the demo shows what Home Assistant builds from a home: floors with their areas, area cards with temperature, and the summary views for lights, climate, security, media players, maintenance, weather and energy. The demo config provides the floors, areas and entities the strategies need, including the temperature and humidity sensors of each area, and a lock and a sprinkler as favorites. Switching demos is a tile in the favorites section, so the demo looks like a dashboard instead of carrying a card that no real home page would have. Its feature row has the button to move to the next demo. Demo navigation is fixed alongside it: navigate resolves paths like the browser does for pushState and keeps query parameters in the URL query instead of inside the hash, so panels can read them, and the route now follows popstate, which is the only event a traversal fires when the query changes too. --------- Co-authored-by: Claude <noreply@anthropic.com>
2026-07-26 22:41:29 +00:00 · 2026-07-26 19:21:23 +03:00 · 2026-07-26 17:41:30 +02:00 · 2026-07-26 15:19:22 +00:00 · 2026-07-26 17:15:10 +02:00 · 2026-07-26 16:26:33 +02:00
77 changed files with 2781 additions and 393 deletions
@@ -32,7 +32,7 @@ jobs:
      ACTIONLINT_VERSION: 1.7.12
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false
      - name: Run actionlint
@@ -21,7 +21,7 @@ jobs:
    runs-on: ubuntu-latest
    steps:
      - name: Check out workflow scripts
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false
          sparse-checkout: .github/scripts
@@ -24,7 +24,7 @@ jobs:
      url: ${{ steps.deploy.outputs.netlify_url }}
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          ref: dev
          persist-credentials: false
@@ -56,7 +56,7 @@ jobs:
      url: ${{ steps.deploy.outputs.netlify_url }}
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          ref: master
          persist-credentials: false
@@ -27,7 +27,7 @@ jobs:
    runs-on: ubuntu-latest
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false
      - name: Prepare dependencies
@@ -39,7 +39,7 @@ jobs:
    runs-on: ubuntu-latest
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false
      - name: Setup Node with shared dependencies
@@ -82,7 +82,7 @@ jobs:
    runs-on: ubuntu-latest
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false
      - name: Setup Node with shared dependencies
@@ -104,7 +104,7 @@ jobs:
    runs-on: ubuntu-latest
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false
      - name: Setup Node with shared dependencies
@@ -27,17 +27,17 @@ jobs:

    steps:
      - name: Check out code from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

      - name: Initialize CodeQL
-        uses: github/codeql-action/init@99df26d4f13ea111d4ec1a7dddef6063f76b97e9 # v4.37.0
+        uses: github/codeql-action/init@7188fc363630916deb702c7fdcf4e481b751f97a # v4.37.1
        with:
          languages: javascript-typescript
          build-mode: none

      - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@99df26d4f13ea111d4ec1a7dddef6063f76b97e9 # v4.37.0
+        uses: github/codeql-action/analyze@7188fc363630916deb702c7fdcf4e481b751f97a # v4.37.1
        with:
          category: "/language:javascript-typescript"
@@ -18,7 +18,7 @@ jobs:
      contents: read
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -25,7 +25,7 @@ jobs:
      url: ${{ steps.deploy.outputs.unique_deploy_url }}
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          ref: dev
          persist-credentials: false
@@ -56,7 +56,7 @@ jobs:
      url: ${{ steps.deploy.outputs.netlify_url }}
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          ref: master
          persist-credentials: false
@@ -19,7 +19,7 @@ jobs:
      url: ${{ steps.deploy.outputs.netlify_url }}
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -24,7 +24,7 @@ jobs:
    if: github.repository == 'home-assistant/frontend' && contains(github.event.pull_request.labels.*.name, 'needs design preview')
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -27,7 +27,7 @@ jobs:
    runs-on: ubuntu-latest
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -45,7 +45,7 @@ jobs:
        shell: bash
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -61,7 +61,7 @@ jobs:
    runs-on: ubuntu-latest
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -92,7 +92,7 @@ jobs:
    runs-on: ubuntu-latest
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -123,7 +123,7 @@ jobs:
    runs-on: ubuntu-latest
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -170,7 +170,7 @@ jobs:
          - 2
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -224,7 +224,7 @@ jobs:
          - 4
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -278,7 +278,7 @@ jobs:
          - 4
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -320,7 +320,7 @@ jobs:
      pull-requests: write
    steps:
      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -10,6 +10,6 @@ jobs:
    runs-on: ubuntu-latest
    steps:
      - name: Apply labels
-        uses: actions/labeler@b8dd2d9be0f68b860e7dae5dae7d772984eacd6d # v6.2.0
+        uses: actions/labeler@bf12e9b00b37c5c0ca2b87b79b2daf7891dbda13 # v7.0.0
        with:
          sync-labels: true
@@ -20,12 +20,12 @@ jobs:
      contents: write
    steps:
      - name: Checkout the repository
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

      - name: Set up Python ${{ env.PYTHON_VERSION }}
-        uses: actions/setup-python@ece7cb06caefa5fff74198d8649806c4678c61a1 # v6
+        uses: actions/setup-python@5fda3b95a4ea91299a34e894583c3862153e4b97 # v7.0.0
        with:
          python-version: ${{ env.PYTHON_VERSION }}

@@ -24,7 +24,7 @@ jobs:
      pull-requests: write # To label and comment on pull requests
    steps:
      - name: Check out workflow scripts
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false
          sparse-checkout: .github/scripts
@@ -18,6 +18,6 @@ jobs:
      pull-requests: read
    runs-on: ubuntu-latest
    steps:
-      - uses: release-drafter/release-drafter@4d75298e00d9e34c483e5ff8c68d0ea1c1940c1e # v7.5.1
+      - uses: release-drafter/release-drafter@eada3c96a64734dd381cfbda23511034e328ddb0 # v7.6.0
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
@@ -26,17 +26,17 @@ jobs:
    if: github.repository_owner == 'home-assistant'
    steps:
      - name: Checkout the repository
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

      - name: Set up Python ${{ env.PYTHON_VERSION }}
-        uses: actions/setup-python@ece7cb06caefa5fff74198d8649806c4678c61a1 # v6.3.0
+        uses: actions/setup-python@5fda3b95a4ea91299a34e894583c3862153e4b97 # v7.0.0
        with:
          python-version: ${{ env.PYTHON_VERSION }}

      - name: Verify version
-        uses: home-assistant/actions/helpers/verify-version@f4ca6f671bd429efb108c0f2fa0ae8af0215986c # master
+        uses: home-assistant/actions/helpers/verify-version@e3fb68ebda13d88a0d695082f471ba2c83d025fb # master

      - name: Setup Node and install
        uses: ./.github/actions/setup
@@ -56,7 +56,7 @@ jobs:
          script/release

      - name: Publish to PyPI
-        uses: pypa/gh-action-pypi-publish@cef221092ed1bacb1cc03d23a2d87d1d172e277b # v1.14.0
+        uses: pypa/gh-action-pypi-publish@ba38be9e461d3875417946c167d0b5f3d385a247 # v1.14.1
        with:
          skip-existing: true

@@ -111,7 +111,7 @@ jobs:
      contents: write # Required to upload release assets
    steps:
      - name: Checkout the repository
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false
      - name: Setup Node and install
@@ -42,7 +42,7 @@ jobs:
    if: github.event.issue.type.name == 'Task'
    steps:
      - name: Check out workflow scripts
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false
          sparse-checkout: .github/scripts
@@ -21,7 +21,7 @@ jobs:
      pull-requests: write
    steps:
      - name: Checkout the repository
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -18,7 +18,7 @@ jobs:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout the repository
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
        with:
          persist-credentials: false

@@ -2,6 +2,8 @@

 You are helping develop the Home Assistant frontend. This repository is a TypeScript application built from Lit-based Web Components for the Home Assistant web UI.

+For the standalone demo — including how to open a specific demo configuration or page via URL — read `demo/AGENTS.md`.
+
 ## Essential Commands

 ```bash
@@ -0,0 +1,46 @@
+# Demo Agent Instructions
+
+This file applies to all files under `demo/`. Follow the root `AGENTS.md` for repository-wide standards.
+
+The demo is the full Home Assistant frontend running against a mocked backend (published at https://demo.home-assistant.io). It needs no Home Assistant server, which makes it the easiest way to load the real UI in a browser, for example to take screenshots.
+
+## Running the demo
+
+Run from the repository root:
+
+```bash
+yarn dev:demo               # dev server on http://localhost:8090
+yarn dev:demo --background  # detached; also supports --status/--stop/--logs
+```
+
+## Opening a specific demo
+
+The demo contains multiple demo configurations. Select one directly with the `demo` query parameter, e.g. `http://localhost:8090/?demo=<slug>`. The valid slugs are defined in `demoConfigs` in `src/configs/demo-configs.ts`, so "the second demo" means the slug of the second entry in that list. An unknown slug falls back to the default (the first entry).
+
+## Opening a specific page
+
+The demo build uses hash-based routing: the frontend path goes in the URL hash, and the `demo` query parameter goes before the `#`. The URL format is:
+
+```
+http://localhost:8090/?demo=<slug>#/<path>
+```
+
+Useful paths:
+
+- `/lovelace/0` — the selected demo's dashboard (also the default when no hash is given)
+- `/energy` — energy dashboard. Its tabs are views: `/energy/overview` (Summary), `/energy/electricity`, `/energy/gas`, `/energy/water`, `/energy/now`
+- `/map`, `/history`, `/todo`, `/config` — other sidebar panels
+
+Example — the water tab of the energy dashboard of the second demo:
+
+```
+http://localhost:8090/?demo=<second slug>#/energy/water
+```
+
+## Structure
+
+- `src/ha-demo.ts`: Root element; sets up all backend mocks.
+- `src/configs/<slug>/`: One directory per demo configuration (entities, dashboard, theme).
+- `src/configs/demo-configs.ts`: Registry of demo configurations and URL slug handling.
+- `src/stubs/`: Mocked WebSocket/REST APIs.
+- `script/develop_demo`, `script/build_demo`: Dev server and static build wrappers.
@@ -0,0 +1 @@
+AGENTS.md
@@ -1,6 +1,9 @@
+import { navigate } from "../../../src/common/navigate";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 import type { Lovelace } from "../../../src/panels/lovelace/types";
+import { setDemoAreas } from "../stubs/area_registry";
 import { energyEntities } from "../stubs/entities";
+import { setDemoFloors } from "../stubs/floor_registry";
 import { getDemoTheme } from "../stubs/frontend";
 import type { DemoConfig, DemoTheme } from "./types";

@@ -12,33 +15,53 @@ export const applyDemoTheme = (hass: MockHomeAssistant, theme: DemoTheme) => {
  hass.mockTheme(null, getDemoTheme(theme));
 };

-export const demoConfigs: (() => Promise<DemoConfig>)[] = [
-  () => import("./sections").then((mod) => mod.demoSections),
-  () => import("./arsaboo").then((mod) => mod.demoArsaboo),
-  () => import("./teachingbirds").then((mod) => mod.demoTeachingbirds),
-  () => import("./kernehed").then((mod) => mod.demoKernehed),
-  () => import("./jimpower").then((mod) => mod.demoJimpower),
-];
+export const demoConfigs: Record<string, () => Promise<DemoConfig>> = {
+  sections: () => import("./sections").then((mod) => mod.demoSections),
+  home: () => import("./home").then((mod) => mod.demoHome),
+  arsaboo: () => import("./arsaboo").then((mod) => mod.demoArsaboo),
+  teachingbirds: () =>
+    import("./teachingbirds").then((mod) => mod.demoTeachingbirds),
+  kernehed: () => import("./kernehed").then((mod) => mod.demoKernehed),
+  jimpower: () => import("./jimpower").then((mod) => mod.demoJimpower),
+};
+
+export const demos = Object.keys(demoConfigs);
+
+const initialDemo = () => {
+  const slug = new URLSearchParams(window.location.search).get("demo");
+  return slug && demos.includes(slug) ? slug : demos[0];
+};

 // eslint-disable-next-line import-x/no-mutable-exports
-export let selectedDemoConfigIndex = 0;
+export let selectedDemo = initialDemo();
 // eslint-disable-next-line import-x/no-mutable-exports
 export let selectedDemoConfig: Promise<DemoConfig> =
-  demoConfigs[selectedDemoConfigIndex]();
+  demoConfigs[selectedDemo]();

 export const setDemoConfig = async (
  hass: MockHomeAssistant,
  lovelace: Lovelace,
-  index: number
+  demo: string
 ) => {
-  const confProm = demoConfigs[index]();
+  const confProm = demoConfigs[demo]();
  const config = await confProm;

-  selectedDemoConfigIndex = index;
+  selectedDemo = demo;
  selectedDemoConfig = confProm;

+  setDemoFloors(hass, config.floors);
+  setDemoAreas(hass, config.areas);
  hass.addEntities(config.entities(hass.localize), true);
  hass.addEntities(energyEntities());
-  lovelace.saveConfig(config.lovelace(hass.localize));
+
+  // Let the new registries and entities reach the dashboard before saving the
+  // config, so dashboard strategies generate against them
+  await new Promise((resolve) => {
+    setTimeout(resolve, 0);
+  });
+
+  await lovelace.saveConfig(config.lovelace(hass.localize));
+  // The view of the previous demo might not exist in the new one
+  navigate(`/${hass.panelUrl}?demo=${demo}`, { replace: true });
  applyDemoTheme(hass, config.theme);
 };
@@ -0,0 +1,63 @@
+import type { DemoArea } from "../../stubs/area_registry";
+import type { DemoFloor } from "../../stubs/floor_registry";
+
+export const demoFloorsHome: DemoFloor[] = [
+  {
+    floor_id: "ground",
+    name: "Ground floor",
+    level: 0,
+  },
+  {
+    floor_id: "upstairs",
+    name: "Upstairs",
+    level: 1,
+  },
+];
+
+export const demoAreasHome: DemoArea[] = [
+  {
+    area_id: "living_room",
+    name: "Living room",
+    floor_id: "ground",
+    icon: "mdi:sofa",
+    temperature_entity_id: "sensor.living_room_temperature",
+    humidity_entity_id: "sensor.living_room_humidity",
+  },
+  {
+    area_id: "kitchen",
+    name: "Kitchen",
+    floor_id: "ground",
+    icon: "mdi:fridge",
+    temperature_entity_id: "sensor.kitchen_temperature",
+    humidity_entity_id: "sensor.kitchen_humidity",
+  },
+  {
+    area_id: "entrance",
+    name: "Entrance",
+    floor_id: "ground",
+    icon: "mdi:door",
+  },
+  {
+    area_id: "bedroom",
+    name: "Bedroom",
+    floor_id: "upstairs",
+    icon: "mdi:bed",
+    temperature_entity_id: "sensor.bedroom_temperature",
+    humidity_entity_id: "sensor.bedroom_humidity",
+  },
+  {
+    area_id: "office",
+    name: "Office",
+    floor_id: "upstairs",
+    icon: "mdi:desk",
+    temperature_entity_id: "sensor.office_temperature",
+    humidity_entity_id: "sensor.office_humidity",
+  },
+  {
+    area_id: "garden",
+    name: "Garden",
+    icon: "mdi:tree",
+    temperature_entity_id: "sensor.garden_temperature",
+    humidity_entity_id: "sensor.garden_humidity",
+  },
+];
@@ -0,0 +1,465 @@
+import type { DemoConfig } from "../types";
+
+export const demoEntitiesHome: DemoConfig["entities"] = () => [
+  // The devices tile on the overview uses zone.home, which always exists in
+  // a real installation.
+  {
+    entity_id: "zone.home",
+    state: "1",
+    attributes: {
+      latitude: 52.3731339,
+      longitude: 4.8903147,
+      radius: 100,
+      friendly_name: "Home",
+      icon: "mdi:home",
+    },
+  },
+  {
+    entity_id: "light.living_room_floor_lamp",
+    state: "on",
+    area_id: "living_room",
+    attributes: {
+      min_color_temp_kelvin: 2000,
+      max_color_temp_kelvin: 6535,
+      supported_color_modes: ["color_temp", "xy"],
+      color_mode: "color_temp",
+      brightness: 178,
+      color_temp_kelvin: 2583,
+      icon: "mdi:floor-lamp",
+      friendly_name: "Floor lamp",
+      supported_features: 44,
+    },
+  },
+  {
+    entity_id: "light.living_room_spotlights",
+    state: "on",
+    area_id: "living_room",
+    attributes: {
+      supported_color_modes: ["brightness"],
+      color_mode: "brightness",
+      brightness: 126,
+      icon: "mdi:ceiling-light-multiple",
+      friendly_name: "Spotlights",
+      supported_features: 32,
+    },
+  },
+  {
+    entity_id: "climate.living_room",
+    state: "heat",
+    area_id: "living_room",
+    attributes: {
+      hvac_modes: ["auto", "heat", "off"],
+      min_temp: 7,
+      max_temp: 35,
+      current_temperature: 21.5,
+      temperature: 21,
+      friendly_name: "Thermostat",
+      supported_features: 385,
+    },
+  },
+  {
+    entity_id: "cover.living_room_blinds",
+    state: "open",
+    area_id: "living_room",
+    attributes: {
+      current_position: 100,
+      device_class: "blind",
+      friendly_name: "Blinds",
+      supported_features: 15,
+    },
+  },
+  {
+    entity_id: "binary_sensor.living_room_window",
+    state: "off",
+    area_id: "living_room",
+    attributes: {
+      device_class: "window",
+      friendly_name: "Window",
+    },
+  },
+  {
+    entity_id: "media_player.living_room_speaker",
+    state: "playing",
+    area_id: "living_room",
+    attributes: {
+      device_class: "speaker",
+      volume_level: 0.28,
+      is_volume_muted: false,
+      media_content_type: "music",
+      media_duration: 300,
+      media_position: 0,
+      media_position_updated_at: new Date(
+        new Date().getTime() - 23000
+      ).toISOString(),
+      media_title: "I Wasn't Born To Follow",
+      media_artist: "The Byrds",
+      media_album_name: "The Notorious Byrd Brothers",
+      shuffle: false,
+      friendly_name: "Living room speaker",
+      supported_features: 64063,
+    },
+  },
+  {
+    entity_id: "sensor.living_room_temperature",
+    state: "21.5",
+    area_id: "living_room",
+    attributes: {
+      state_class: "measurement",
+      unit_of_measurement: "°C",
+      device_class: "temperature",
+      friendly_name: "Temperature",
+    },
+  },
+  {
+    entity_id: "sensor.living_room_humidity",
+    state: "45",
+    area_id: "living_room",
+    attributes: {
+      state_class: "measurement",
+      unit_of_measurement: "%",
+      device_class: "humidity",
+      friendly_name: "Humidity",
+    },
+  },
+  {
+    entity_id: "light.kitchen_spotlights",
+    state: "on",
+    area_id: "kitchen",
+    attributes: {
+      supported_color_modes: ["brightness"],
+      color_mode: "brightness",
+      brightness: 255,
+      icon: "mdi:ceiling-light-multiple",
+      friendly_name: "Spotlights",
+      supported_features: 32,
+    },
+  },
+  {
+    entity_id: "light.kitchen_worktop",
+    state: "off",
+    area_id: "kitchen",
+    attributes: {
+      supported_color_modes: ["brightness"],
+      color_mode: null,
+      brightness: null,
+      icon: "mdi:light-flood-down",
+      friendly_name: "Worktop",
+      supported_features: 32,
+    },
+  },
+  {
+    entity_id: "switch.coffee_machine",
+    state: "on",
+    area_id: "kitchen",
+    attributes: {
+      icon: "mdi:coffee-maker",
+      friendly_name: "Coffee machine",
+    },
+  },
+  {
+    entity_id: "binary_sensor.kitchen_motion",
+    state: "off",
+    area_id: "kitchen",
+    attributes: {
+      device_class: "motion",
+      friendly_name: "Motion",
+    },
+  },
+  {
+    entity_id: "media_player.kitchen_speaker",
+    state: "idle",
+    area_id: "kitchen",
+    attributes: {
+      device_class: "speaker",
+      volume_level: 0.18,
+      is_volume_muted: false,
+      friendly_name: "Kitchen speaker",
+      supported_features: 64063,
+    },
+  },
+  {
+    entity_id: "sensor.kitchen_temperature",
+    state: "22.1",
+    area_id: "kitchen",
+    attributes: {
+      state_class: "measurement",
+      unit_of_measurement: "°C",
+      device_class: "temperature",
+      friendly_name: "Temperature",
+    },
+  },
+  {
+    entity_id: "sensor.kitchen_humidity",
+    state: "48",
+    area_id: "kitchen",
+    attributes: {
+      state_class: "measurement",
+      unit_of_measurement: "%",
+      device_class: "humidity",
+      friendly_name: "Humidity",
+    },
+  },
+  {
+    entity_id: "lock.front_door",
+    state: "locked",
+    area_id: "entrance",
+    attributes: {
+      friendly_name: "Front door",
+      supported_features: 1,
+    },
+  },
+  {
+    entity_id: "binary_sensor.front_door",
+    state: "off",
+    area_id: "entrance",
+    attributes: {
+      device_class: "door",
+      friendly_name: "Front door",
+    },
+  },
+  {
+    entity_id: "alarm_control_panel.home_alarm",
+    state: "disarmed",
+    area_id: "entrance",
+    attributes: {
+      changed_by: null,
+      code_arm_required: false,
+      friendly_name: "Home alarm",
+      supported_features: 3,
+    },
+  },
+  {
+    entity_id: "light.entrance_ceiling",
+    state: "off",
+    area_id: "entrance",
+    attributes: {
+      supported_color_modes: ["brightness"],
+      color_mode: null,
+      brightness: null,
+      friendly_name: "Ceiling light",
+      supported_features: 32,
+    },
+  },
+  {
+    entity_id: "sensor.front_door_lock_battery",
+    state: "88",
+    area_id: "entrance",
+    attributes: {
+      state_class: "measurement",
+      unit_of_measurement: "%",
+      device_class: "battery",
+      friendly_name: "Front door lock battery",
+    },
+  },
+  {
+    entity_id: "light.bedroom_ceiling",
+    state: "off",
+    area_id: "bedroom",
+    attributes: {
+      supported_color_modes: ["color_temp"],
+      color_mode: null,
+      brightness: null,
+      friendly_name: "Ceiling light",
+      supported_features: 44,
+    },
+  },
+  {
+    entity_id: "light.bedside_lamp",
+    state: "off",
+    area_id: "bedroom",
+    attributes: {
+      supported_color_modes: ["brightness"],
+      color_mode: null,
+      brightness: null,
+      icon: "mdi:lamp",
+      friendly_name: "Bedside lamp",
+      supported_features: 32,
+    },
+  },
+  {
+    entity_id: "cover.bedroom_shutter",
+    state: "open",
+    area_id: "bedroom",
+    attributes: {
+      current_position: 100,
+      device_class: "shutter",
+      friendly_name: "Shutter",
+      supported_features: 15,
+    },
+  },
+  {
+    entity_id: "media_player.bedroom_speaker",
+    state: "off",
+    area_id: "bedroom",
+    attributes: {
+      device_class: "speaker",
+      friendly_name: "Bedroom speaker",
+      supported_features: 64063,
+    },
+  },
+  {
+    entity_id: "binary_sensor.bedroom_motion",
+    state: "off",
+    area_id: "bedroom",
+    attributes: {
+      device_class: "motion",
+      friendly_name: "Motion",
+    },
+  },
+  {
+    entity_id: "sensor.bedroom_motion_battery",
+    state: "15",
+    area_id: "bedroom",
+    attributes: {
+      state_class: "measurement",
+      unit_of_measurement: "%",
+      device_class: "battery",
+      friendly_name: "Motion sensor battery",
+    },
+  },
+  {
+    entity_id: "sensor.bedroom_temperature",
+    state: "19.6",
+    area_id: "bedroom",
+    attributes: {
+      state_class: "measurement",
+      unit_of_measurement: "°C",
+      device_class: "temperature",
+      friendly_name: "Temperature",
+    },
+  },
+  {
+    entity_id: "sensor.bedroom_humidity",
+    state: "52",
+    area_id: "bedroom",
+    attributes: {
+      state_class: "measurement",
+      unit_of_measurement: "%",
+      device_class: "humidity",
+      friendly_name: "Humidity",
+    },
+  },
+  {
+    entity_id: "light.office_desk_lamp",
+    state: "on",
+    area_id: "office",
+    attributes: {
+      supported_color_modes: ["brightness"],
+      color_mode: "brightness",
+      brightness: 200,
+      icon: "mdi:desk-lamp",
+      friendly_name: "Desk lamp",
+      supported_features: 32,
+    },
+  },
+  {
+    entity_id: "fan.office_ceiling_fan",
+    state: "off",
+    area_id: "office",
+    attributes: {
+      percentage: 0,
+      percentage_step: 25,
+      friendly_name: "Ceiling fan",
+      supported_features: 1,
+    },
+  },
+  {
+    entity_id: "binary_sensor.office_window",
+    state: "off",
+    area_id: "office",
+    attributes: {
+      device_class: "window",
+      friendly_name: "Window",
+    },
+  },
+  {
+    entity_id: "sensor.office_temperature",
+    state: "21.8",
+    area_id: "office",
+    attributes: {
+      state_class: "measurement",
+      unit_of_measurement: "°C",
+      device_class: "temperature",
+      friendly_name: "Temperature",
+    },
+  },
+  {
+    entity_id: "sensor.office_humidity",
+    state: "50",
+    area_id: "office",
+    attributes: {
+      state_class: "measurement",
+      unit_of_measurement: "%",
+      device_class: "humidity",
+      friendly_name: "Humidity",
+    },
+  },
+  {
+    entity_id: "switch.garden_sprinkler",
+    state: "off",
+    area_id: "garden",
+    attributes: {
+      icon: "mdi:sprinkler-variant",
+      friendly_name: "Sprinkler",
+    },
+  },
+  {
+    entity_id: "light.garden_path",
+    state: "off",
+    area_id: "garden",
+    attributes: {
+      supported_color_modes: ["brightness"],
+      color_mode: null,
+      brightness: null,
+      icon: "mdi:outdoor-lamp",
+      friendly_name: "Path lights",
+      supported_features: 32,
+    },
+  },
+  {
+    entity_id: "binary_sensor.garden_gate",
+    state: "off",
+    area_id: "garden",
+    attributes: {
+      device_class: "opening",
+      friendly_name: "Gate",
+    },
+  },
+  {
+    entity_id: "sensor.garden_temperature",
+    state: "14.2",
+    area_id: "garden",
+    attributes: {
+      state_class: "measurement",
+      unit_of_measurement: "°C",
+      device_class: "temperature",
+      friendly_name: "Temperature",
+    },
+  },
+  {
+    entity_id: "sensor.garden_humidity",
+    state: "68",
+    area_id: "garden",
+    attributes: {
+      state_class: "measurement",
+      unit_of_measurement: "%",
+      device_class: "humidity",
+      friendly_name: "Humidity",
+    },
+  },
+  {
+    entity_id: "weather.home",
+    state: "partlycloudy",
+    area_id: "garden",
+    attributes: {
+      temperature: 14.2,
+      temperature_unit: "°C",
+      humidity: 68,
+      pressure: 1012,
+      pressure_unit: "hPa",
+      wind_speed: 11.2,
+      wind_speed_unit: "km/h",
+      friendly_name: "Home",
+    },
+  },
+];
@@ -0,0 +1,17 @@
+import type { DemoConfig } from "../types";
+import { demoAreasHome, demoFloorsHome } from "./areas";
+import { demoEntitiesHome } from "./entities";
+import { demoLovelaceHome } from "./lovelace";
+
+export const demoHome: DemoConfig = {
+  authorName: "Home Assistant",
+  authorUrl: "https://www.home-assistant.io",
+  name: "Home page",
+  description:
+    "The page you land on when you open Home Assistant, automatically built from the areas in your home and the devices in them.",
+  lovelace: demoLovelaceHome,
+  entities: demoEntitiesHome,
+  floors: demoFloorsHome,
+  areas: demoAreasHome,
+  theme: { theme: "default", dark: false },
+};
@@ -0,0 +1,9 @@
+import "./strategies";
+import type { DemoConfig } from "../types";
+
+export const demoLovelaceHome: DemoConfig["lovelace"] = () => ({
+  strategy: {
+    type: "custom:demo-home",
+    favorite_entities: ["lock.front_door", "switch.garden_sprinkler"],
+  },
+});
@@ -0,0 +1,109 @@
+import { ReactiveElement } from "lit";
+import { isStrategySection } from "../../../../src/data/lovelace/config/section";
+import type { LovelaceConfig } from "../../../../src/data/lovelace/config/types";
+import type { LovelaceViewConfig } from "../../../../src/data/lovelace/config/view";
+import { isStrategyView } from "../../../../src/data/lovelace/config/view";
+import type { HomeDashboardStrategyConfig } from "../../../../src/panels/lovelace/strategies/home/home-dashboard-strategy";
+import { HomeDashboardStrategy } from "../../../../src/panels/lovelace/strategies/home/home-dashboard-strategy";
+import type { HomeOverviewViewStrategyConfig } from "../../../../src/panels/lovelace/strategies/home/home-overview-view-strategy";
+import { HomeOverviewViewStrategy } from "../../../../src/panels/lovelace/strategies/home/home-overview-view-strategy";
+import { generateLovelaceSectionStrategy } from "../../../../src/panels/lovelace/strategies/get-strategy";
+import type { HomeAssistant } from "../../../../src/types";
+
+export interface DemoHomeDashboardStrategyConfig extends Omit<
+  HomeDashboardStrategyConfig,
+  "type"
+> {
+  type: "custom:demo-home";
+}
+
+interface DemoHomeOverviewViewStrategyConfig extends Omit<
+  HomeOverviewViewStrategyConfig,
+  "type"
+> {
+  type: "custom:demo-home-overview";
+}
+
+class DemoHomeDashboardStrategy extends ReactiveElement {
+  static registryDependencies = HomeDashboardStrategy.registryDependencies;
+
+  static async generate(
+    config: DemoHomeDashboardStrategyConfig,
+    hass: HomeAssistant
+  ): Promise<LovelaceConfig> {
+    const generated = await HomeDashboardStrategy.generate(
+      { ...config, type: "home" },
+      hass
+    );
+    // Swap the overview view for the demo version, which adds the demo card.
+    return {
+      ...generated,
+      views: generated.views.map((view) =>
+        isStrategyView(view) && view.strategy.type === "home-overview"
+          ? {
+              ...view,
+              strategy: { ...view.strategy, type: "custom:demo-home-overview" },
+            }
+          : view
+      ),
+    };
+  }
+}
+
+class DemoHomeOverviewViewStrategy extends ReactiveElement {
+  static registryDependencies = HomeOverviewViewStrategy.registryDependencies;
+
+  static async generate(
+    config: DemoHomeOverviewViewStrategyConfig,
+    hass: HomeAssistant
+  ): Promise<LovelaceViewConfig> {
+    const view = await HomeOverviewViewStrategy.generate(
+      { ...config, type: "home-overview" },
+      hass
+    );
+    // Expand the favorites section so the demo card can be added to it
+    const sections = await Promise.all(
+      (view.sections || []).map(async (section) => {
+        if (
+          !isStrategySection(section) ||
+          section.strategy.type !== "common-controls"
+        ) {
+          return section;
+        }
+        // The demo card takes up the space of two tiles
+        const limit = (section.strategy.limit as number | undefined) ?? 8;
+        const favorites = await generateLovelaceSectionStrategy(
+          { ...section, strategy: { ...section.strategy, limit: limit - 2 } },
+          hass
+        );
+        const [heading, ...cards] = favorites.cards || [];
+        return {
+          ...favorites,
+          // Place the demo card first so the tiles fill the rows next to it
+          cards: [heading, { type: "custom:ha-demo-next-card" }, ...cards],
+        };
+      })
+    );
+
+    return {
+      ...view,
+      sections: sections,
+    };
+  }
+}
+
+customElements.define(
+  "ll-strategy-dashboard-demo-home",
+  DemoHomeDashboardStrategy
+);
+customElements.define(
+  "ll-strategy-view-demo-home-overview",
+  DemoHomeOverviewViewStrategy
+);
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "ll-strategy-dashboard-demo-home": DemoHomeDashboardStrategy;
+    "ll-strategy-view-demo-home-overview": DemoHomeOverviewViewStrategy;
+  }
+}
@@ -1,8 +1,10 @@
 import type { TemplateResult } from "lit";
 import type { LocalizeFunc } from "../../../src/common/translations/localize";
-import type { LovelaceConfig } from "../../../src/data/lovelace/config/types";
+import type { LovelaceRawConfig } from "../../../src/data/lovelace/config/types";
 import type { EntityInput } from "../../../src/fake_data/entities/types";
 import type { ThemeSettings } from "../../../src/types";
+import type { DemoArea } from "../stubs/area_registry";
+import type { DemoFloor } from "../stubs/floor_registry";

 export type DemoTheme = ThemeSettings | (() => Record<string, string> | null);

@@ -13,7 +15,9 @@ export interface DemoConfig {
  authorUrl: string;
  description?:
    string | ((localize: LocalizeFunc) => string | TemplateResult<1>);
-  lovelace: (localize: LocalizeFunc) => LovelaceConfig;
+  lovelace: (localize: LocalizeFunc) => LovelaceRawConfig;
  entities: (localize: LocalizeFunc) => EntityInput[];
+  floors?: DemoFloor[];
+  areas?: DemoArea[];
  theme: DemoTheme;
 }
@@ -41,25 +41,30 @@ class CastDemoRow extends LitElement implements LovelaceRow {
  protected firstUpdated(changedProps: PropertyValues<this>) {
    super.firstUpdated(changedProps);
    import("../../../src/cast/cast_manager").then(({ getCastManager }) =>
-      getCastManager().then((mgr) => {
-        this._castManager = mgr;
-        mgr.addEventListener("state-changed", () => {
-          this.requestUpdate();
-        });
-        mgr.castContext.addEventListener(
-          cast.framework.CastContextEventType.SESSION_STATE_CHANGED,
-          (ev) => {
-            // On Android, opening a new session always results in SESSION_RESUMED.
-            // So treat both as the same.
-            if (
-              ev.sessionState === "SESSION_STARTED" ||
-              ev.sessionState === "SESSION_RESUMED"
-            ) {
-              castSendShowDemo(mgr);
+      getCastManager().then(
+        (mgr) => {
+          this._castManager = mgr;
+          mgr.addEventListener("state-changed", () => {
+            this.requestUpdate();
+          });
+          mgr.castContext.addEventListener(
+            cast.framework.CastContextEventType.SESSION_STATE_CHANGED,
+            (ev) => {
+              // On Android, opening a new session always results in SESSION_RESUMED.
+              // So treat both as the same.
+              if (
+                ev.sessionState === "SESSION_STARTED" ||
+                ev.sessionState === "SESSION_RESUMED"
+              ) {
+                castSendShowDemo(mgr);
+              }
            }
-          }
-        );
-      })
+          );
+        },
+        () => {
+          this._castManager = null;
+        }
+      )
    );
  }

@@ -13,9 +13,9 @@ import type {
  LovelaceCard,
 } from "../../../src/panels/lovelace/types";
 import {
-  demoConfigs,
+  demos,
+  selectedDemo,
  selectedDemoConfig,
-  selectedDemoConfigIndex,
 } from "../configs/demo-configs";

@customElement("ha-demo-card")
@@ -112,16 +112,12 @@ export class HADemoCard extends LitElement implements LovelaceCard {
  }

  private _nextConfig() {
-    this._updateConfig(
-      selectedDemoConfigIndex < demoConfigs.length - 1
-        ? selectedDemoConfigIndex + 1
-        : 0
-    );
+    this._updateConfig(demos[(demos.indexOf(selectedDemo) + 1) % demos.length]);
  }

-  private async _updateConfig(index: number) {
+  private async _updateConfig(demo: string) {
    this._switching = true;
-    fireEvent(this, "set-demo-config" as any, { index });
+    fireEvent(this, "set-demo-config" as any, { demo });
  }

  static get styles(): CSSResultGroup {
@@ -0,0 +1,103 @@
+import { css, html, LitElement, nothing } from "lit";
+import { customElement, property, state } from "lit/decorators";
+import { until } from "lit/directives/until";
+import { fireEvent } from "../../../src/common/dom/fire_event";
+import "../../../src/components/ha-card";
+import "../../../src/components/ha-control-button";
+import "../../../src/components/ha-control-button-group";
+import "../../../src/components/tile/ha-tile-container";
+import "../../../src/components/tile/ha-tile-icon";
+import "../../../src/components/tile/ha-tile-info";
+import type { LovelaceCardConfig } from "../../../src/data/lovelace/config/card";
+import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { tileCardStyle } from "../../../src/panels/lovelace/cards/tile/tile-card-style";
+import type {
+  LovelaceCard,
+  LovelaceGridOptions,
+} from "../../../src/panels/lovelace/types";
+import {
+  demos,
+  selectedDemo,
+  selectedDemoConfig,
+} from "../configs/demo-configs";
+
+@customElement("ha-demo-next-card")
+export class HADemoNextCard extends LitElement implements LovelaceCard {
+  @property({ attribute: false }) public hass!: MockHomeAssistant;
+
+  @state() private _switching = false;
+
+  public getCardSize() {
+    return 2;
+  }
+
+  public getGridOptions(): LovelaceGridOptions {
+    return {
+      columns: 6,
+      rows: 2,
+      min_columns: 6,
+      min_rows: 2,
+    };
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  public setConfig(_config: LovelaceCardConfig) {}
+
+  protected render() {
+    return html`
+      <ha-card>
+        <ha-tile-container>
+          <ha-tile-icon slot="icon" icon="mdi:home-assistant"></ha-tile-icon>
+          <ha-tile-info slot="info">
+            <span slot="primary">
+              ${until(
+                selectedDemoConfig.then((conf) => conf.name),
+                nothing
+              )}
+            </span>
+            <span slot="secondary">
+              ${this.hass.localize(
+                "ui.panel.page-demo.cards.demo.interactive_demo"
+              )}
+            </span>
+          </ha-tile-info>
+          <ha-control-button-group slot="features">
+            <ha-control-button
+              .disabled=${this._switching}
+              @click=${this._nextConfig}
+            >
+              ${this.hass.localize("ui.panel.page-demo.cards.demo.next_demo")}
+            </ha-control-button>
+          </ha-control-button-group>
+        </ha-tile-container>
+      </ha-card>
+    `;
+  }
+
+  private _nextConfig() {
+    this._switching = true;
+    fireEvent(this, "set-demo-config" as any, {
+      demo: demos[(demos.indexOf(selectedDemo) + 1) % demos.length],
+    });
+  }
+
+  static styles = [
+    tileCardStyle,
+    css`
+      :host {
+        --tile-color: var(--primary-color);
+      }
+      ha-control-button-group {
+        --control-button-group-spacing: 0;
+        --control-button-group-thickness: var(--feature-height, 42px);
+        padding: 0 var(--ha-space-3) var(--ha-space-3);
+      }
+    `,
+  ];
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "ha-demo-next-card": HADemoNextCard;
+  }
+}
@@ -6,7 +6,7 @@ import { provideHass } from "../../src/fake_data/provide_hass";
 import { HomeAssistantAppEl } from "../../src/layouts/home-assistant";
 import type { HomeAssistant } from "../../src/types";
 import { applyDemoTheme, selectedDemoConfig } from "./configs/demo-configs";
-import { mockAreaRegistry } from "./stubs/area_registry";
+import { mockAreaRegistry, setDemoAreas } from "./stubs/area_registry";
 import { mockAuth } from "./stubs/auth";
 import { demoDevices } from "./stubs/devices";
 import { mockDeviceRegistry } from "./stubs/device_registry";
@@ -14,7 +14,7 @@ import { mockEnergy } from "./stubs/energy";
 import { energyEntities } from "./stubs/entities";
 import { mockEntityRegistry } from "./stubs/entity_registry";
 import { mockEvents } from "./stubs/events";
-import { mockFloorRegistry } from "./stubs/floor_registry";
+import { mockFloorRegistry, setDemoFloors } from "./stubs/floor_registry";
 import { mockFrontend } from "./stubs/frontend";
 import { mockIntegration } from "./stubs/integration";
 import { mockLabelRegistry } from "./stubs/label_registry";
@@ -29,6 +29,7 @@ import { mockSystemLog } from "./stubs/system_log";
 import { mockTemplate } from "./stubs/template";
 import { mockTodo } from "./stubs/todo";
 import { mockTranslations } from "./stubs/translations";
+import { mockUsagePrediction } from "./stubs/usage_prediction";
 import "./cloud/cloud-demo-controls";

 // WS command / REST path prefixes whose mocks live in the lazily imported
@@ -74,11 +75,17 @@ export class HaDemo extends HomeAssistantAppEl {

    // The cloud account page only fetches backup config and the webhook count
    // when those integrations are loaded. Enable them here (demo only) so the
-    // mocked backup/config/info and webhook/list are queried.
+    // mocked backup/config/info and webhook/list are queried. usage_prediction
+    // is needed for common-controls sections in strategy dashboards.
    hass.updateHass({
      config: {
        ...hass.config,
-        components: [...(hass.config?.components ?? []), "backup", "webhook"],
+        components: [
+          ...(hass.config?.components ?? []),
+          "backup",
+          "webhook",
+          "usage_prediction",
+        ],
      },
    });

@@ -122,6 +129,7 @@ export class HaDemo extends HomeAssistantAppEl {
    mockDeviceRegistry(hass, demoDevices);
    mockFloorRegistry(hass);
    mockLabelRegistry(hass);
+    mockUsagePrediction(hass);
    mockEntityRegistry(hass, [
      {
        config_entry_id: "co2signal",
@@ -169,9 +177,11 @@ export class HaDemo extends HomeAssistantAppEl {

    hass.addEntities(energyEntities());

-    // Once config is loaded AND localize, set entities and apply theme.
+    // Once config is loaded AND localize, set registries, entities and theme.
    Promise.all([selectedDemoConfig, localizePromise]).then(
      ([conf, localize]) => {
+        setDemoFloors(hass, conf.floors);
+        setDemoAreas(hass, conf.areas);
        hass.addEntities(conf.entities(localize));
        applyDemoTheme(hass, conf.theme);
      }
@@ -1,14 +1,46 @@
 import type { AreaRegistryEntry } from "../../../src/data/area/area_registry";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";

+export interface DemoArea {
+  area_id: string;
+  name: string;
+  floor_id?: string;
+  icon?: string;
+  temperature_entity_id?: string;
+  humidity_entity_id?: string;
+}
+
+let areas: AreaRegistryEntry[] = [];
+
 export const mockAreaRegistry = (
  hass: MockHomeAssistant,
-  data: AreaRegistryEntry[] = []
+  data: DemoArea[] = []
 ) => {
-  hass.mockWS("config/area_registry/list", () => data);
-  const areas = {};
-  data.forEach((area) => {
-    areas[area.area_id] = area;
-  });
-  hass.updateHass({ areas });
+  hass.mockWS("config/area_registry/list", () => areas);
+  setDemoAreas(hass, data);
+};
+
+/** Set the areas of the currently loaded demo config. */
+export const setDemoAreas = (
+  hass: MockHomeAssistant,
+  demoAreas: DemoArea[] = []
+) => {
+  areas = demoAreas.map((area) => ({
+    area_id: area.area_id,
+    name: area.name,
+    floor_id: area.floor_id ?? null,
+    icon: area.icon ?? null,
+    temperature_entity_id: area.temperature_entity_id ?? null,
+    humidity_entity_id: area.humidity_entity_id ?? null,
+    aliases: [],
+    labels: [],
+    picture: null,
+    created_at: 0,
+    modified_at: 0,
+  }));
+  const areasById: Record<string, AreaRegistryEntry> = {};
+  areas.forEach((area) => {
+    areasById[area.area_id] = area;
+  });
+  hass.updateHass({ areas: areasById });
 };
@@ -85,7 +85,7 @@ export const energyEntities = () =>
      },
    },
    "sensor.energy_consumption_tarif_1": {
-      entity_id: "sensor.energy_consumption_tarif_1	",
+      entity_id: "sensor.energy_consumption_tarif_1",
      state: "88.6",
      attributes: {
        last_reset: "1970-01-01T00:00:00:00+00",
@@ -1,7 +1,40 @@
 import type { FloorRegistryEntry } from "../../../src/data/floor_registry";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";

+export interface DemoFloor {
+  floor_id: string;
+  name: string;
+  level?: number;
+  icon?: string;
+}
+
+let floors: FloorRegistryEntry[] = [];
+
 export const mockFloorRegistry = (
  hass: MockHomeAssistant,
-  data: FloorRegistryEntry[] = []
-) => hass.mockWS("config/floor_registry/list", () => data);
+  data: DemoFloor[] = []
+) => {
+  hass.mockWS("config/floor_registry/list", () => floors);
+  setDemoFloors(hass, data);
+};
+
+/** Set the floors of the currently loaded demo config. */
+export const setDemoFloors = (
+  hass: MockHomeAssistant,
+  demoFloors: DemoFloor[] = []
+) => {
+  floors = demoFloors.map((floor) => ({
+    floor_id: floor.floor_id,
+    name: floor.name,
+    level: floor.level ?? null,
+    icon: floor.icon ?? null,
+    aliases: [],
+    created_at: 0,
+    modified_at: 0,
+  }));
+  const floorsById: Record<string, FloorRegistryEntry> = {};
+  floors.forEach((floor) => {
+    floorsById[floor.floor_id] = floor;
+  });
+  hass.updateHass({ floors: floorsById });
+};
@@ -2,12 +2,13 @@ import type { LocalizeFunc } from "../../../src/common/translations/localize";
 import type { LovelaceInfo } from "../../../src/data/lovelace/resource";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 import {
+  selectedDemo,
  selectedDemoConfig,
-  selectedDemoConfigIndex,
  setDemoConfig,
 } from "../configs/demo-configs";
 import "../custom-cards/cast-demo-row";
 import "../custom-cards/ha-demo-card";
+import "../custom-cards/ha-demo-next-card";
 import { mapEntities } from "./entities";

 export const mockLovelace = (
@@ -45,11 +46,11 @@ customElements.whenDefined("hui-root").then(() => {
  HUIRoot.prototype.firstUpdated = function (changedProperties) {
    oldFirstUpdated.call(this, changedProperties);
    this.addEventListener("set-demo-config", async (ev) => {
-      const index = (ev as CustomEvent).detail.index;
+      const demo = (ev as CustomEvent).detail.demo;
      try {
-        await setDemoConfig(this.hass, this.lovelace!, index);
+        await setDemoConfig(this.hass, this.lovelace!, demo);
      } catch (_err: any) {
-        setDemoConfig(this.hass, this.lovelace!, selectedDemoConfigIndex);
+        setDemoConfig(this.hass, this.lovelace!, selectedDemo);
        alert("Failed to switch config :-(");
      }
    });
@@ -0,0 +1,19 @@
+import type { CommonControlsResult } from "../../../src/data/usage_prediction";
+import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+
+export const mockUsagePrediction = (hass: MockHomeAssistant) => {
+  // Entities that don't exist in the currently loaded demo config are
+  // filtered out by the common-controls section strategy.
+  hass.mockWS("usage_prediction/common_control", (): CommonControlsResult => ({
+    entities: [
+      "light.living_room_floor_lamp",
+      "climate.living_room",
+      "cover.living_room_blinds",
+      "media_player.living_room_speaker",
+      "light.kitchen_spotlights",
+      "switch.coffee_machine",
+      "light.bedside_lamp",
+      "alarm_control_panel.home_alarm",
+    ],
+  }));
+};
@@ -2,7 +2,10 @@
 import type { TemplateResult } from "lit";
 import { html, LitElement } from "lit";
 import { customElement, state } from "lit/decorators";
-import { mockAreaRegistry } from "../../../../demo/src/stubs/area_registry";
+import {
+  mockAreaRegistry,
+  type DemoArea,
+} from "../../../../demo/src/stubs/area_registry";
 import { mockConfigEntries } from "../../../../demo/src/stubs/config_entries";
 import { mockDeviceRegistry } from "../../../../demo/src/stubs/device_registry";
 import { mockEntityRegistry } from "../../../../demo/src/stubs/entity_registry";
@@ -10,7 +13,6 @@ import { mockHassioSupervisor } from "../../../../demo/src/stubs/hassio_supervis
 import { computeInitialHaFormData } from "../../../../src/components/ha-form/compute-initial-ha-form-data";
 import "../../../../src/components/ha-form/ha-form";
 import type { HaFormSchema } from "../../../../src/components/ha-form/types";
-import type { AreaRegistryEntry } from "../../../../src/data/area/area_registry";
 import type { DeviceRegistryEntry } from "../../../../src/data/device/device_registry";
 import { provideHass } from "../../../../src/fake_data/provide_hass";
 import type { HomeAssistant } from "../../../../src/types";
@@ -136,45 +138,20 @@ const DEVICES: DeviceRegistryEntry[] = [
  },
 ];

-const AREAS: AreaRegistryEntry[] = [
+const AREAS: DemoArea[] = [
  {
    area_id: "backyard",
-    floor_id: null,
    name: "Backyard",
-    icon: null,
-    picture: null,
-    aliases: [],
-    labels: [],
-    temperature_entity_id: null,
-    humidity_entity_id: null,
-    created_at: 0,
-    modified_at: 0,
  },
  {
    area_id: "bedroom",
-    floor_id: null,
    name: "Bedroom",
    icon: "mdi:bed",
-    picture: null,
-    aliases: [],
-    labels: [],
-    temperature_entity_id: null,
-    humidity_entity_id: null,
-    created_at: 0,
-    modified_at: 0,
  },
  {
    area_id: "livingroom",
-    floor_id: null,
    name: "Livingroom",
    icon: "mdi:sofa",
-    picture: null,
-    aliases: [],
-    labels: [],
-    temperature_entity_id: null,
-    humidity_entity_id: null,
-    created_at: 0,
-    modified_at: 0,
  },
 ];

@@ -1,21 +1,25 @@
 import type { TemplateResult } from "lit";
 import { css, html, LitElement, nothing } from "lit";
 import { customElement, state } from "lit/decorators";
-import { mockAreaRegistry } from "../../../../demo/src/stubs/area_registry";
+import {
+  mockAreaRegistry,
+  type DemoArea,
+} from "../../../../demo/src/stubs/area_registry";
 import { mockConfigEntries } from "../../../../demo/src/stubs/config_entries";
 import { mockDeviceRegistry } from "../../../../demo/src/stubs/device_registry";
 import { mockEntityRegistry } from "../../../../demo/src/stubs/entity_registry";
-import { mockFloorRegistry } from "../../../../demo/src/stubs/floor_registry";
+import {
+  mockFloorRegistry,
+  type DemoFloor,
+} from "../../../../demo/src/stubs/floor_registry";
 import { mockHassioSupervisor } from "../../../../demo/src/stubs/hassio_supervisor";
 import { mockLabelRegistry } from "../../../../demo/src/stubs/label_registry";
 import type { HASSDomEvent } from "../../../../src/common/dom/fire_event";
 import "../../../../src/components/ha-formfield";
 import "../../../../src/components/ha-selector/ha-selector";
 import "../../../../src/components/ha-settings-row";
-import type { AreaRegistryEntry } from "../../../../src/data/area/area_registry";
 import type { BlueprintInput } from "../../../../src/data/blueprint";
 import type { DeviceRegistryEntry } from "../../../../src/data/device/device_registry";
-import type { FloorRegistryEntry } from "../../../../src/data/floor_registry";
 import type { LabelRegistryEntry } from "../../../../src/data/label/label_registry";
 import {
  showDialog,
@@ -147,75 +151,43 @@ const DEVICES: DeviceRegistryEntry[] = [
  },
 ];

-const AREAS: AreaRegistryEntry[] = [
+const AREAS: DemoArea[] = [
  {
    area_id: "backyard",
    floor_id: "ground",
    name: "Backyard",
-    icon: null,
-    picture: null,
-    aliases: [],
-    labels: [],
-    temperature_entity_id: null,
-    humidity_entity_id: null,
-    created_at: 0,
-    modified_at: 0,
  },
  {
    area_id: "bedroom",
    floor_id: "first",
    name: "Bedroom",
    icon: "mdi:bed",
-    picture: null,
-    aliases: [],
-    labels: [],
-    temperature_entity_id: null,
-    humidity_entity_id: null,
-    created_at: 0,
-    modified_at: 0,
  },
  {
    area_id: "livingroom",
    floor_id: "ground",
    name: "Livingroom",
    icon: "mdi:sofa",
-    picture: null,
-    aliases: [],
-    labels: [],
-    temperature_entity_id: null,
-    humidity_entity_id: null,
-    created_at: 0,
-    modified_at: 0,
  },
 ];

-const FLOORS: FloorRegistryEntry[] = [
+const FLOORS: DemoFloor[] = [
  {
    floor_id: "ground",
    name: "Ground floor",
    level: 0,
-    icon: null,
-    aliases: [],
-    created_at: 0,
-    modified_at: 0,
  },
  {
    floor_id: "first",
    name: "First floor",
    level: 1,
    icon: "mdi:numeric-1",
-    aliases: [],
-    created_at: 0,
-    modified_at: 0,
  },
  {
    floor_id: "second",
    name: "Second floor",
    level: 2,
    icon: "mdi:numeric-2",
-    aliases: [],
-    created_at: 0,
-    modified_at: 0,
  },
 ];

@@ -91,7 +91,7 @@
    "@webcomponents/webcomponentsjs": "2.8.0",
    "barcode-detector": "3.2.1",
    "cally": "0.9.2",
-    "color-name": "2.1.0",
+    "color-name": "2.1.1",
    "comlink": "4.4.2",
    "core-js": "3.49.0",
    "cropperjs": "1.6.2",
@@ -108,7 +108,7 @@
    "home-assistant-js-websocket": "9.6.0",
    "idb-keyval": "6.3.0",
    "intl-messageformat": "11.2.12",
-    "js-yaml": "5.2.1",
+    "js-yaml": "5.2.2",
    "leaflet": "1.9.4",
    "leaflet-draw": "patch:leaflet-draw@npm%3A1.0.4#./.yarn/patches/leaflet-draw-npm-1.0.4-0ca0ebcf65.patch",
    "leaflet.markercluster": "1.5.3",
@@ -151,8 +151,8 @@
    "@octokit/plugin-retry": "8.1.0",
    "@octokit/rest": "22.0.1",
    "@playwright/test": "1.61.1",
-    "@rsdoctor/rspack-plugin": "1.6.0",
-    "@rspack/core": "2.1.4",
+    "@rsdoctor/rspack-plugin": "1.6.1",
+    "@rspack/core": "2.1.5",
    "@rspack/dev-server": "2.1.0",
    "@types/babel__plugin-transform-runtime": "7.9.5",
    "@types/chromecast-caf-receiver": "6.0.26",
@@ -196,18 +196,18 @@
    "jsdom": "29.1.1",
    "jszip": "3.10.1",
    "license-checker-rseidelsohn": "5.0.1",
-    "lint-staged": "17.1.0",
+    "lint-staged": "17.2.0",
    "lit-analyzer": "2.0.3",
    "lodash.merge": "4.6.2",
    "lodash.template": "4.18.1",
    "map-stream": "0.0.7",
    "minify-literals": "2.1.0",
    "pinst": "3.0.0",
-    "prettier": "3.9.5",
+    "prettier": "3.9.6",
    "rspack-manifest-plugin": "5.2.2",
    "serve": "14.2.6",
    "sinon": "22.1.0",
-    "tar": "7.5.20",
+    "tar": "7.5.21",
    "terser-webpack-plugin": "5.6.1",
    "ts-lit-plugin": "2.0.2",
    "typescript": "6.0.3",
@@ -226,8 +226,7 @@
    "@fullcalendar/daygrid": "6.1.21",
    "globals": "17.7.0",
    "tslib": "2.8.1",
-    "@material/mwc-list@^0.27.0": "patch:@material/mwc-list@npm%3A0.27.0#~/.yarn/patches/@material-mwc-list-npm-0.27.0-5344fc9de4.patch",
-    "glob@^10.2.2": "^10.5.0"
+    "@material/mwc-list@^0.27.0": "patch:@material/mwc-list@npm%3A0.27.0#~/.yarn/patches/@material-mwc-list-npm-0.27.0-5344fc9de4.patch"
  },
  "packageManager": "yarn@4.17.1",
  "volta": {
@@ -9,16 +9,17 @@ export const castApiAvailable = () => {

  loadedPromise = new Promise((resolve) => {
    (window as any).__onGCastApiAvailable = resolve;
-  });
-  // Any element with a specific ID will get set as a JS variable on window
-  // This will override the cast SDK if the iconset is loaded afterwards.
-  // Conflicting IDs will no longer mess with window, so we'll just append one.
-  const el = document.createElement("div");
-  el.id = "cast";
-  document.body.append(el);

-  loadJS(
-    "https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"
-  );
+    // Any element with a specific ID will get set as a JS variable on window
+    // This will override the cast SDK if the iconset is loaded afterwards.
+    // Conflicting IDs will no longer mess with window, so we'll just append one.
+    const el = document.createElement("div");
+    el.id = "cast";
+    document.body.append(el);
+
+    loadJS(
+      "https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"
+    ).catch(() => resolve(false));
+  });
  return loadedPromise;
 };
@@ -64,22 +64,15 @@ export const navigate = async (path: string, options?: NavigateOptions) => {
  const replace = options?.replace || false;

  if (__DEMO__) {
-    if (path.includes("#")) {
-      if (replace) {
-        mainWindow.history.replaceState(
-          mainWindow.history.state?.root
-            ? { root: true }
-            : (options?.data ?? null),
-          "",
-          path
-        );
-      } else {
-        mainWindow.history.pushState(options?.data ?? null, "", path);
-      }
-      fireEvent(mainWindow, "location-changed", {
-        replace,
-      });
-      return true;
+    if (!path.includes("#")) {
+      // The demo routes with the hash instead of the pathname. Resolve the
+      // path like the browser would do for pushState, and keep the query
+      // parameters in the URL query instead of inside the hash.
+      const url = new URL(
+        path,
+        `${mainWindow.location.origin}${mainWindow.location.hash.substring(1)}`
+      );
+      path = `${mainWindow.location.pathname}${url.search}#${url.pathname}`;
    }
    if (replace) {
      mainWindow.history.replaceState(
@@ -87,10 +80,10 @@ export const navigate = async (path: string, options?: NavigateOptions) => {
          ? { root: true }
          : (options?.data ?? null),
        "",
-        `${mainWindow.location.pathname}#${path}`
+        path
      );
    } else {
-      mainWindow.location.hash = path;
+      mainWindow.history.pushState(options?.data ?? null, "", path);
    }
  } else if (replace) {
    mainWindow.history.replaceState(
@@ -36,6 +36,10 @@ export function downSampleLineData<
  const min = minX ?? getPointData(data[0]!)[0];
  const max = maxX ?? getPointData(data[data.length - 1]!)[0];
  const step = Math.ceil((max - min) / Math.floor(maxDetails));
+  if (!Number.isFinite(step) || step <= 0) {
+    // a degenerate frame size would put every point in a single frame
+    return data;
+  }

  if (useMean) {
    // Group points into frames, accumulating sums in insertion order.
@@ -51,6 +51,7 @@ export const MIN_TIME_BETWEEN_UPDATES = 60 * 5 * 1000;
 const LEGEND_OVERFLOW_LIMIT = 10;
 const LEGEND_OVERFLOW_LIMIT_MOBILE = 6;
 const DOUBLE_TAP_TIME = 300;
+const DEFAULT_CHART_WIDTH = 500;

 type RawSeriesOption = Exclude<
  NonNullable<ECOption["series"]>,
@@ -1048,7 +1049,9 @@ export class HaChartBase extends LitElement {
            sampling: undefined,
            data: downSampleLineData(
              data as LineSeriesOption["data"],
-              this.clientWidth * window.devicePixelRatio,
+              // 0 while inside a hidden container, e.g. a section with a visibility condition
+              (this.clientWidth || DEFAULT_CHART_WIDTH) *
+                window.devicePixelRatio,
              minX,
              maxX
            ),
@@ -141,7 +141,7 @@ export class HaChooseSelector extends LitElement {
  }

  private _value(choice?: string): any {
-    if (this.value === null || this.value === undefined) {
+    if (!this.value) {
      return undefined;
    }
    return typeof this.value === "object"
@@ -24,6 +24,8 @@ export interface ToastClosedEventDetail {
 export class HaToast extends LitElement {
  @property({ attribute: "label-text" }) public labelText = "";

+  @property({ attribute: "announce-text" }) public announceText?: string;
+
  @property({ type: Number, attribute: "timeout-ms" }) public timeoutMs = 4000;

  @property({ type: Number, attribute: "bottom-offset" }) public bottomOffset =
@@ -190,8 +192,6 @@ export class HaToast extends LitElement {
        style=${styleMap({
          "--ha-toast-bottom-offset": `${this.bottomOffset}px`,
        })}
-        role="status"
-        aria-live="polite"
        popover=${ifDefined(popoverSupported ? "manual" : undefined)}
      >
        <span class="message">${this.labelText}</span>
@@ -200,6 +200,14 @@ export class HaToast extends LitElement {
          <slot name="dismiss"></slot>
        </div>
      </div>
+      <span
+        class="assistive-message"
+        role="status"
+        aria-live=${this._active ? "polite" : "off"}
+        aria-atomic="true"
+      >
+        ${this.announceText ?? this.labelText}
+      </span>
    `;
  }

@@ -254,6 +262,18 @@ export class HaToast extends LitElement {
      min-width: 0;
    }

+    .assistive-message {
+      position: absolute;
+      width: 1px;
+      height: 1px;
+      padding: 0;
+      margin: -1px;
+      overflow: hidden;
+      clip: rect(0, 0, 0, 0);
+      white-space: nowrap;
+      border: 0;
+    }
+
    .actions {
      display: flex;
      align-items: center;
@@ -36,3 +36,13 @@ export interface DirtyStateContext<
 * boundary.
 */
 export const dirtyStateContext = createContext<DirtyStateContext>("dirtyState");
+
+declare global {
+  interface Window {
+    isDirtyState?: boolean;
+  }
+
+  interface HASSDomEvents {
+    "dirty-state-changed": { isDirty: boolean };
+  }
+}
@@ -108,7 +108,7 @@ class StepFlowForm extends LitElement {
            : nothing
        }
        ${
-          step.data_schema.length
+          step.data_schema.length || this._errors
            ? html`<ha-form
                ${ref(this._formRef)}
                ?autofocus=${this.autoFocus}
@@ -54,6 +54,7 @@ export class HaImagecropperDialog
  }

  protected updated(changedProperties: PropertyValues) {
+    super.updated(changedProperties);
    if (!changedProperties.has("_params") || !this._params) {
      return;
    }
@@ -16,6 +16,38 @@ export const demoPanels: Panels = {
    config: null,
    url_path: "home",
  },
+  light: {
+    component_name: "light",
+    icon: "mdi:lamps",
+    title: "light",
+    default_visible: false,
+    config: null,
+    url_path: "light",
+  },
+  climate: {
+    component_name: "climate",
+    icon: "mdi:home-thermometer",
+    title: "climate",
+    default_visible: false,
+    config: null,
+    url_path: "climate",
+  },
+  security: {
+    component_name: "security",
+    icon: "mdi:security",
+    title: "security",
+    default_visible: false,
+    config: null,
+    url_path: "security",
+  },
+  maintenance: {
+    component_name: "maintenance",
+    icon: "mdi:wrench",
+    title: "maintenance",
+    default_visible: false,
+    config: null,
+    url_path: "maintenance",
+  },
  "dev-state": {
    component_name: "dev-state",
    icon: null,
@@ -27,6 +27,8 @@ export class MockBaseEntity {

  public state: string;

+  public areaId?: string;
+
  public baseAttributes: EntityAttributes;

  public attributes: EntityAttributes;
@@ -47,6 +49,7 @@ export class MockBaseEntity {
    this.domain = domain;
    this.objectId = objectId;
    this.state = input.state;
+    this.areaId = input.area_id;
    this.lastChanged = randomTime();
    this.lastUpdated = randomTime();

@@ -127,6 +130,8 @@ export class MockBaseEntity {
      "entity_picture",
      "assumed_state",
      "device_class",
+      "state_class",
+      "unit_of_measurement",
      "supported_features",
    ]) {
      if (key in attrs) {
@@ -10,7 +10,10 @@ export type EntityAttributes = HassEntityAttributeBase & Record<string, any>;
 export type EntityInput = Pick<
  HassEntity,
  "entity_id" | "state" | "attributes"
->;
+> & {
+  /** Area the entity is assigned to in the mocked entity registry */
+  area_id?: string;
+};

 /**
 * The hass mock object interface, kept intentionally loose
@@ -299,6 +299,7 @@ export const provideHass = (
        icon: undefined,
        platform: "demo",
        labels: [],
+        area_id: ent.areaId,
      } satisfies EntityRegistryDisplayEntry;
    });
    if (replace) {
@@ -173,11 +173,7 @@ export class HomeAssistantAppEl extends QuickBarMixin(HassElement) {
    window.addEventListener("location-changed", () => updateRoute());

    // Handle history changes
-    if (useHash) {
-      window.addEventListener("hashchange", () => updateRoute());
-    } else {
-      window.addEventListener("popstate", () => updateRoute());
-    }
+    window.addEventListener("popstate", () => updateRoute());

    // Handle clicking on links
    window.addEventListener("click", (ev) => {
@@ -13,8 +13,13 @@ export interface ShowToastParams {
  // Unique ID for the toast. If a new toast is shown with the same ID as the previous toast, it will be replaced to avoid flickering.
  id?: string;
  message:
-    string | { translationKey: LocalizeKeys; args?: Record<string, string> };
+    | string
+    | { translationKey: LocalizeKeys; args?: Record<string, string | number> };
+  announceMessage?:
+    | string
+    | { translationKey: LocalizeKeys; args?: Record<string, string | number> };
  action?: ToastActionParams;
+  secondaryAction?: ToastActionParams;
  dismiss?: () => void;
  duration?: number;
  dismissable?: boolean;
@@ -23,8 +28,10 @@ export interface ShowToastParams {

 export interface ToastActionParams {
  action: () => void;
+  primary?: boolean;
  text:
-    string | { translationKey: LocalizeKeys; args?: Record<string, string> };
+    | string
+    | { translationKey: LocalizeKeys; args?: Record<string, string | number> };
 }

@customElement("notification-manager")
@@ -93,31 +100,22 @@ class NotificationManager extends LitElement {
              )
            : this._parameters.message
        }
+        .announceText=${
+          this._parameters.announceMessage
+            ? typeof this._parameters.announceMessage !== "string"
+              ? this.hass.localize(
+                  this._parameters.announceMessage.translationKey,
+                  this._parameters.announceMessage.args
+                )
+              : this._parameters.announceMessage
+            : undefined
+        }
        .timeoutMs=${this._parameters.duration!}
        .bottomOffset=${this._parameters.bottomOffset ?? 0}
        @toast-closed=${this._toastClosed}
      >
-        ${
-          this._parameters?.action
-            ? html`
-                <ha-button
-                  appearance="plain"
-                  size="s"
-                  slot="action"
-                  @click=${this._buttonClicked}
-                >
-                  ${
-                    typeof this._parameters?.action.text !== "string"
-                      ? this.hass.localize(
-                          this._parameters?.action.text.translationKey,
-                          this._parameters?.action.text.args
-                        )
-                      : this._parameters?.action.text
-                  }
-                </ha-button>
-              `
-            : nothing
-        }
+        ${this._renderAction(this._parameters.secondaryAction, true)}
+        ${this._renderAction(this._parameters.action, false)}
        ${
          this._parameters?.dismissable
            ? html`
@@ -134,11 +132,37 @@ class NotificationManager extends LitElement {
    `;
  }

+  private _renderAction(
+    action: ToastActionParams | undefined,
+    secondary: boolean
+  ) {
+    if (!action) {
+      return nothing;
+    }
+    return html`
+      <ha-button
+        appearance=${action.primary ? "filled" : "plain"}
+        size="s"
+        slot="action"
+        @click=${secondary ? this._secondaryButtonClicked : this._buttonClicked}
+      >
+        ${
+          typeof action.text !== "string"
+            ? this.hass.localize(action.text.translationKey, action.text.args)
+            : action.text
+        }
+      </ha-button>
+    `;
+  }
+
  private _buttonClicked() {
    this._toast?.hide("action");
-    if (this._parameters?.action) {
-      this._parameters?.action.action();
-    }
+    this._parameters?.action?.action();
+  }
+
+  private _secondaryButtonClicked() {
+    this._toast?.hide("action");
+    this._parameters?.secondaryAction?.action();
  }

  private _dismissClicked() {
@@ -1,7 +1,8 @@
 import { provide } from "@lit/context";
 import deepClone from "deep-clone-simple";
-import type { LitElement } from "lit";
+import type { LitElement, PropertyValues } from "lit";
 import { state } from "lit/decorators";
+import { fireEvent } from "../common/dom/fire_event";
 import { deepEqual } from "../common/util/deep-equal";
 import { shallowEqual } from "../common/util/shallow-equal";
 import {
@@ -17,6 +18,18 @@ export type CompareStrategy<State> =
  | { type: "shallow" }
  | { type: "custom"; compare: (a: State, b: State) => boolean };

+const connectedDirtyStateProviders = new Map<object, boolean>();
+
+const publishGlobalDirtyState = (): void => {
+  const isDirty = Array.from(connectedDirtyStateProviders.values()).some(
+    Boolean
+  );
+  if (isDirty !== window.isDirtyState) {
+    window.isDirtyState = isDirty;
+    fireEvent(window, "dirty-state-changed", { isDirty });
+  }
+};
+
 /**
 * Mixin that provides dirty-state tracking via Lit context.
 *
@@ -26,6 +39,9 @@ export type CompareStrategy<State> =
 * so independent contributors (e.g. a helper form alongside the entity
 * registry editor) can coexist without overwriting each other.
 *
+ * Connected providers contribute to the global dirty state. It remains dirty
+ * while any provider has unsaved changes.
+ *
 * `isEffectiveDirty` runs the same comparison, but first passes each slice's
 * initial and current value through the optional `effectiveNormalize` function
 * given to `_initDirtyTracking`. Provide a normalizer that collapses values you
@@ -118,6 +134,24 @@ export const DirtyStateProviderMixin =
        this._dirtyStateContext = this._buildContextValue();
      }

+      public connectedCallback(): void {
+        super.connectedCallback();
+        connectedDirtyStateProviders.set(this, this.isDirtyState);
+        publishGlobalDirtyState();
+      }
+
+      protected updated(changedProperties: PropertyValues<this>): void {
+        super.updated(changedProperties);
+        connectedDirtyStateProviders.set(this, this.isDirtyState);
+        publishGlobalDirtyState();
+      }
+
+      public disconnectedCallback(): void {
+        connectedDirtyStateProviders.delete(this);
+        publishGlobalDirtyState();
+        super.disconnectedCallback();
+      }
+
      private _writeSlice(key: Key | DefaultDirtyStateKey, value: State): void {
        const slice = this._dirtySlices.get(key);
        if (!slice) {
@@ -203,6 +203,7 @@ class DialogBackupOnboarding
  }

  protected updated(changedProps: PropertyValues) {
+    super.updated(changedProps);
    if (changedProps.has("_step") && this._step === "key") {
      this._save();
    }
@@ -145,6 +145,10 @@ class HaConfigBackupBackups extends SubscribeMixin(LitElement) {

  public connectedCallback() {
    super.connectedCallback();
+    // Re-apply the type filter from the URL when the page is (re)displayed,
+    // e.g. when navigating back to a cached instance of this page with a
+    // different `type` query param.
+    this._setFiltersFromUrl();
    window.addEventListener("location-changed", this._locationChanged);
    window.addEventListener("popstate", this._popState);
  }
@@ -34,6 +34,8 @@ export const supportsTrendGraphCardFeature = (

 export const DEFAULT_HOURS_TO_SHOW = 24;

+const HOUR = 60 * 60 * 1000;
+
@customElement("hui-trend-graph-card-feature")
 class HuiHistoryChartCardFeature
  extends LitElement
@@ -93,9 +95,13 @@ class HuiHistoryChartCardFeature

  public connectedCallback() {
    super.connectedCallback();
-    // redraw the graph every minute to update the time axis
+    // recompute the graph every minute so the x-axis (and the horizontal fill
+    // to now) keeps advancing even while the sensor value stays constant
    clearInterval(this._interval);
-    this._interval = window.setInterval(() => this.requestUpdate(), 1000 * 60);
+    this._interval = window.setInterval(
+      () => this._calculateCoordinates(),
+      1000 * 60
+    );
    if (this.hasUpdated) {
      this._subscribeHistory();
    }
@@ -146,12 +152,18 @@ class HuiHistoryChartCardFeature
      ? Math.max(10, width / 5, hourToShow)
      : Math.max(10, hourToShow);
    const useMean = !detail;
+    // Anchor the x-axis to the full time window so a constant value is drawn as
+    // a horizontal line up to now, instead of ending at the last state change.
+    const now = Date.now();
    const { points, yAxisOrigin } = coordinatesMinimalResponseCompressedState(
      this._stateHistory,
      width,
      height,
      maxDetails,
-      undefined,
+      {
+        minX: now - hourToShow * HOUR,
+        maxX: now,
+      },
      useMean
    );
    this._coordinates = points;
@@ -146,6 +146,7 @@ export class HuiDialogEditBadge
  }

  protected updated(changedProps: PropertyValues): void {
+    super.updated(changedProps);
    if (!changedProps.has("_badgeConfig")) {
      return;
    }
@@ -135,6 +135,7 @@ export class HuiDialogEditCard
  }

  protected updated(changedProps: PropertyValues): void {
+    super.updated(changedProps);
    if (!this._cardConfig || !changedProps.has("_cardConfig")) {
      return;
    }
@@ -76,6 +76,7 @@ export class HuiDialogEditSection
  @query("ha-yaml-editor") private _editor?: HaYamlEditor;

  protected updated(changedProperties: PropertyValues) {
+    super.updated(changedProperties);
    if (this._yamlMode && changedProperties.has("_yamlMode")) {
      const sectionConfig = {
        ...this._config,
@@ -94,6 +94,7 @@ export class HuiDialogEditView extends DirtyStateProviderMixin<LovelaceViewConfi
  }

  protected updated(changedProperties: PropertyValues) {
+    super.updated(changedProperties);
    if (this._yamlMode && changedProperties.has("_yamlMode")) {
      const viewConfig = {
        ...this._config,
@@ -43,6 +43,7 @@ export class HuiDialogEditViewFooter extends DirtyStateProviderMixin<LovelaceVie
  @state() private _open = false;

  protected updated(changedProperties: PropertyValues) {
+    super.updated(changedProperties);
    if (this._yamlMode && changedProperties.has("_yamlMode")) {
      const config = {
        ...this._config,
@@ -44,6 +44,7 @@ export class HuiDialogEditViewHeader extends DirtyStateProviderMixin<LovelaceVie
  @state() private _open = false;

  protected updated(changedProperties: PropertyValues) {
+    super.updated(changedProperties);
    if (this._yamlMode && changedProperties.has("_yamlMode")) {
      const config = {
        ...this._config,
@@ -107,7 +107,7 @@ class HuiNumberEntityRow extends LitElement implements LovelaceRow {
                    .step=${Number(stateObj.attributes.step)}
                    .min=${Number(stateObj.attributes.min)}
                    .max=${Number(stateObj.attributes.max)}
-                    .value=${stateObj.state}
+                    .value=${Number(stateObj.state).toString()}
                    type="number"
                    @change=${this._selectedValueChanged}
                  >
@@ -104,6 +104,7 @@ class LovelaceFullConfigEditor extends DirtyStateProviderMixin<string>()(
  }

  protected updated(changedProps: PropertyValues<this>) {
+    super.updated(changedProps);
    const oldLovelace = changedProps.get("lovelace") as Lovelace | undefined;
    if (
      !this._saving &&
@@ -101,8 +101,7 @@ export class SectionsView extends LitElement implements LovelaceViewElement {
      const columns = Math.floor(
        (totalWidth - padding + columnGap) / (minColumnWidth + columnGap)
      );
-      const maxColumns = this._config?.max_columns ?? DEFAULT_MAX_COLUMNS;
-      return clamp(columns, 1, maxColumns);
+      return Math.max(columns, 1);
    },
  });

@@ -155,7 +154,14 @@ export class SectionsView extends LitElement implements LovelaceViewElement {
  }

  private _updateMaxColumnCount(): void {
-    const maxColumnCount = this._columnsController.value ?? 1;
+    // The column count is clamped here instead of in the resize callback, so
+    // that it follows the config of the view the element is currently used for
+    const maxColumns = this._config?.max_columns ?? DEFAULT_MAX_COLUMNS;
+    const maxColumnCount = clamp(
+      this._columnsController.value ?? 1,
+      1,
+      maxColumns
+    );

    if (maxColumnCount !== this._maxColumns) {
      this._maxColumns = maxColumnCount;
@@ -2510,8 +2510,8 @@
      "triggered": "Triggered {name}",
      "dismiss": "Dismiss",
      "no_matching_link_found": "No matching My link found for {path}",
-      "new_version_available": "A new version of the frontend is available.",
-      "reload": "Reload",
+      "new_version_available": "A new version of the frontend is available. This page will update in {seconds, plural, one {# second} other {# seconds}}.",
+      "update_now": "Update now",
      "theme_save_failed": "Unable to save theme settings to your user profile.",
      "theme_preferences_unavailable": "Unable to load user profile theme settings.",
      "onboarding_survey": {
@@ -11252,6 +11252,7 @@
        "cards": {
          "demo": {
            "demo_by": "by {name}",
+            "interactive_demo": "Interactive demo",
            "next_demo": "Next demo",
            "introduction": "Welcome home! You've reached the Home Assistant demo where we showcase the best UIs created by our community.",
            "learn_more": "Learn more about Home Assistant"
@@ -1,5 +1,8 @@
 import { showToast } from "./toast";

+const UPDATE_DELAY = 60_000;
+const UPDATE_TOAST_ID = "frontend-update-available";
+
 export const supportsServiceWorker = () =>
  "serviceWorker" in navigator &&
  (location.protocol === "https:" || location.hostname === "localhost");
@@ -23,6 +26,92 @@ export const registerServiceWorker = async (
    return;
  }

+  let pendingWorker: ServiceWorker | undefined;
+  let updateDeadline = 0;
+  let updateInterval = 0;
+
+  const hideUpdateToast = () => {
+    showToast(rootEl, {
+      id: UPDATE_TOAST_ID,
+      message: "",
+      duration: 0,
+    });
+  };
+
+  const clearUpdateCountdown = () => {
+    clearInterval(updateInterval);
+  };
+
+  const activateUpdate = () => {
+    if (!pendingWorker) {
+      return;
+    }
+    clearUpdateCountdown();
+    hideUpdateToast();
+    pendingWorker.postMessage({ type: "skipWaiting" });
+    pendingWorker = undefined;
+  };
+
+  const showUpdateToast = () => {
+    const seconds = Math.ceil((updateDeadline - Date.now()) / 1000);
+    if (seconds <= 0) {
+      activateUpdate();
+      return;
+    }
+    const announceSeconds =
+      seconds > 40 ? 60 : seconds > 20 ? 40 : seconds > 5 ? 20 : 5;
+    showToast(rootEl, {
+      id: UPDATE_TOAST_ID,
+      message: {
+        translationKey: "ui.notification_toast.new_version_available",
+        args: { seconds },
+      },
+      announceMessage: {
+        translationKey: "ui.notification_toast.new_version_available",
+        args: { seconds: announceSeconds },
+      },
+      action: {
+        action: activateUpdate,
+        primary: true,
+        text: { translationKey: "ui.notification_toast.update_now" },
+      },
+      secondaryAction: {
+        action: () => {
+          pendingWorker = undefined;
+          clearUpdateCountdown();
+        },
+        text: { translationKey: "ui.common.cancel" },
+      },
+      duration: -1,
+    });
+  };
+
+  const startUpdateCountdown = () => {
+    updateDeadline = Date.now() + UPDATE_DELAY;
+    showUpdateToast();
+    updateInterval = window.setInterval(showUpdateToast, 1000);
+  };
+
+  window.addEventListener("dirty-state-changed", () => {
+    if (!pendingWorker) {
+      return;
+    }
+    if (window.isDirtyState) {
+      clearUpdateCountdown();
+      hideUpdateToast();
+      return;
+    }
+    startUpdateCountdown();
+  });
+
+  const updateReady = (worker: ServiceWorker) => {
+    clearUpdateCountdown();
+    pendingWorker = worker;
+    if (!window.isDirtyState) {
+      startUpdateCountdown();
+    }
+  };
+
  reg.addEventListener("updatefound", () => {
    const installingWorker = reg.installing;

@@ -37,22 +126,11 @@ export const registerServiceWorker = async (
      ) {
        return;
      }
-
-      // Notify users a new frontend is available.
-      showToast(rootEl, {
-        message: {
-          translationKey: "ui.notification_toast.new_version_available",
-        },
-        action: {
-          // We tell the service worker to call skipWaiting, which activates
-          // the new service worker. Above we listen for `controllerchange`
-          // so we reload the page once a new service worker activates.
-          action: () => installingWorker.postMessage({ type: "skipWaiting" }),
-          text: { translationKey: "ui.notification_toast.reload" },
-        },
-        duration: -1,
-        dismissable: false,
-      });
+      updateReady(installingWorker);
    });
  });
+
+  if (reg.waiting && navigator.serviceWorker.controller) {
+    updateReady(reg.waiting);
+  }
 };
@@ -32,6 +32,22 @@ describe("downSampleLineData", () => {
    expect(downSampleLineData(points, 100)).toBe(points);
  });

+  it("returns input unchanged when maxDetails is zero", () => {
+    const points = generatePoints(11, 720);
+    expect(downSampleLineData(points, 0)).toBe(points);
+    expect(
+      downSampleLineData(points, 0, points[0][0], points[points.length - 1][0])
+    ).toBe(points);
+  });
+
+  it("returns input unchanged when all points share the same x", () => {
+    const points: [number, number][] = Array.from({ length: 20 }, (_, i) => [
+      FIXED_EPOCH_MS,
+      i,
+    ]);
+    expect(downSampleLineData(points, 5)).toBe(points);
+  });
+
  it("skips points with non-finite coordinates", () => {
    const points = generatePoints(2, 200);
    points[10] = [points[10][0], NaN];
@@ -0,0 +1,177 @@
+import { afterEach, describe, expect, it, vi } from "vitest";
+import type { HaToast } from "../../src/components/ha-toast";
+import "../../src/components/ha-toast";
+
+let toast: HaToast | undefined;
+
+const mountToast = async (properties: Partial<HaToast> = {}) => {
+  toast = document.createElement("ha-toast");
+  Object.assign(toast, properties);
+  document.body.append(toast);
+  await toast.updateComplete;
+  return toast;
+};
+
+afterEach(() => {
+  toast?.remove();
+  toast = undefined;
+  vi.useRealTimers();
+});
+
+const showToast = async (element: HaToast) => {
+  vi.useFakeTimers();
+  const shown = element.show();
+  await element.updateComplete;
+  Object.defineProperty(
+    element.shadowRoot!.querySelector(".toast"),
+    "getAnimations",
+    {
+      configurable: true,
+      value: () => [],
+    }
+  );
+  await vi.advanceTimersByTimeAsync(20);
+  await shown;
+};
+
+describe("ha-toast", () => {
+  it("renders its message and bottom offset", async () => {
+    const element = await mountToast({
+      labelText: "Configuration saved",
+      bottomOffset: 24,
+    });
+
+    expect(element.shadowRoot?.querySelector(".message")?.textContent).toBe(
+      "Configuration saved"
+    );
+    expect(
+      (
+        element.shadowRoot?.querySelector(".toast") as HTMLElement
+      ).style.getPropertyValue("--ha-toast-bottom-offset")
+    ).toBe("24px");
+  });
+
+  it("renders assigned action and dismiss content", async () => {
+    toast = document.createElement("ha-toast");
+    const action = document.createElement("button");
+    action.slot = "action";
+    const dismiss = document.createElement("button");
+    dismiss.slot = "dismiss";
+    toast.append(action, dismiss);
+    document.body.append(toast);
+    await toast.updateComplete;
+    toast.requestUpdate();
+    await toast.updateComplete;
+
+    expect(
+      toast.shadowRoot
+        ?.querySelector<HTMLSlotElement>('slot[name="action"]')
+        ?.assignedElements()
+    ).toEqual([action]);
+    expect(
+      toast.shadowRoot
+        ?.querySelector<HTMLSlotElement>('slot[name="dismiss"]')
+        ?.assignedElements()
+    ).toEqual([dismiss]);
+    expect(
+      toast.shadowRoot
+        ?.querySelector(".actions")
+        ?.classList.contains("has-action")
+    ).toBe(true);
+  });
+
+  it("keeps changing visual text separate from live-region text", async () => {
+    const element = await mountToast({
+      labelText: "Updating in 59 seconds",
+      announceText: "Updating in 60 seconds",
+    });
+
+    const visibleMessage = element.shadowRoot!.querySelector(".message")!;
+    const liveRegion = element.shadowRoot!.querySelector(".assistive-message")!;
+    expect(visibleMessage.textContent).toBe("Updating in 59 seconds");
+    expect(visibleMessage.closest('[role="status"]')).toBeNull();
+    expect(liveRegion.textContent?.trim()).toBe("Updating in 60 seconds");
+    expect(liveRegion.getAttribute("role")).toBe("status");
+    expect(liveRegion.getAttribute("aria-atomic")).toBe("true");
+  });
+
+  it("falls back to announcing the visible message", async () => {
+    const element = await mountToast({ labelText: "Configuration saved" });
+
+    expect(
+      element
+        .shadowRoot!.querySelector(".assistive-message")!
+        .textContent?.trim()
+    ).toBe("Configuration saved");
+  });
+
+  it("activates its live region while shown", async () => {
+    const element = await mountToast();
+    const liveRegion = element.shadowRoot!.querySelector(".assistive-message")!;
+    expect(liveRegion.getAttribute("aria-live")).toBe("off");
+
+    await showToast(element);
+
+    expect(liveRegion.getAttribute("aria-live")).toBe("polite");
+    expect(
+      element.shadowRoot!.querySelector(".toast")!.classList.contains("visible")
+    ).toBe(true);
+  });
+
+  it.each(["action", "dismiss", "programmatic"] as const)(
+    "reports a %s close reason",
+    async (reason) => {
+      const element = await mountToast({ timeoutMs: -1 });
+      const listener = vi.fn();
+      element.addEventListener("toast-closed", listener);
+      await showToast(element);
+
+      await element.hide(reason);
+
+      expect(listener).toHaveBeenCalledOnce();
+      expect(listener.mock.calls[0][0].detail).toEqual({ reason });
+      expect(
+        element
+          .shadowRoot!.querySelector(".toast")!
+          .classList.contains("active")
+      ).toBe(false);
+      expect(
+        element
+          .shadowRoot!.querySelector(".assistive-message")!
+          .getAttribute("aria-live")
+      ).toBe("off");
+    }
+  );
+
+  it("closes with a timeout reason", async () => {
+    const element = await mountToast({ timeoutMs: 1000 });
+    const listener = vi.fn();
+    element.addEventListener("toast-closed", listener);
+    await showToast(element);
+
+    await vi.advanceTimersByTimeAsync(1000);
+
+    expect(listener.mock.calls[0][0].detail).toEqual({ reason: "timeout" });
+  });
+
+  it("does not close automatically when the timeout is disabled", async () => {
+    const element = await mountToast({ timeoutMs: -1 });
+    const listener = vi.fn();
+    element.addEventListener("toast-closed", listener);
+    await showToast(element);
+
+    await vi.advanceTimersByTimeAsync(10_000);
+
+    expect(listener).not.toHaveBeenCalled();
+  });
+
+  it("does not emit a close event when already hidden", async () => {
+    const element = await mountToast();
+    const listener = vi.fn();
+    element.addEventListener("toast-closed", listener);
+
+    await element.hide("dismiss");
+
+    expect(listener).not.toHaveBeenCalled();
+  });
+});
@@ -0,0 +1,119 @@
+import { html, LitElement } from "lit";
+import { customElement, property } from "lit/decorators";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import type { HomeAssistant } from "../../src/types";
+import "../../src/managers/notification-manager";
+
+vi.mock("../../src/components/ha-button", () => {
+  customElements.define("ha-button", class extends HTMLElement {});
+  return {};
+});
+
+const localize = (key: string, args?: Record<string, string | number>) =>
+  args ? `${key}:${JSON.stringify(args)}` : key;
+
+@customElement("test-notification-lifecycle-host")
+class TestNotificationLifecycleHost extends LitElement {
+  @property({ attribute: false }) public hass = {
+    localize,
+  } as unknown as HomeAssistant;
+
+  protected render() {
+    return html`<notification-manager
+      .hass=${this.hass}
+    ></notification-manager>`;
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "test-notification-lifecycle-host": TestNotificationLifecycleHost;
+  }
+}
+
+let host: TestNotificationLifecycleHost | undefined;
+
+afterEach(() => {
+  host?.remove();
+  host = undefined;
+  vi.useRealTimers();
+});
+
+describe("notification toast lifecycle", () => {
+  it("updates a visible toast and closes it after its primary action", async () => {
+    vi.useFakeTimers();
+    host = document.createElement("test-notification-lifecycle-host");
+    document.body.append(host);
+    await host.updateComplete;
+    const manager = host.shadowRoot!.querySelector("notification-manager")!;
+    const action = vi.fn();
+
+    const firstShow = manager.showDialog({
+      id: "frontend-update-available",
+      message: {
+        translationKey: "ui.notification_toast.new_version_available",
+        args: { seconds: 60 },
+      },
+      announceMessage: {
+        translationKey: "ui.notification_toast.new_version_available",
+        args: { seconds: 60 },
+      },
+      action: { action, primary: true, text: "Update now" },
+      duration: -1,
+    });
+    await Promise.resolve();
+    await manager.updateComplete;
+    const toast = manager.shadowRoot!.querySelector("ha-toast")!;
+    Object.defineProperty(
+      toast.shadowRoot!.querySelector(".toast"),
+      "getAnimations",
+      {
+        configurable: true,
+        value: () => [],
+      }
+    );
+    await vi.advanceTimersByTimeAsync(20);
+    await firstShow;
+
+    expect(toast.shadowRoot!.querySelector(".toast")!.classList).toContain(
+      "visible"
+    );
+    expect(toast.shadowRoot!.querySelector(".message")!.textContent).toContain(
+      '"seconds":60'
+    );
+    expect(
+      toast.shadowRoot!.querySelector(".assistive-message")!.textContent
+    ).toContain('"seconds":60');
+
+    await manager.showDialog({
+      id: "frontend-update-available",
+      message: {
+        translationKey: "ui.notification_toast.new_version_available",
+        args: { seconds: 59 },
+      },
+      announceMessage: {
+        translationKey: "ui.notification_toast.new_version_available",
+        args: { seconds: 60 },
+      },
+      action: { action, primary: true, text: "Update now" },
+      duration: -1,
+    });
+
+    expect(toast.shadowRoot!.querySelector(".message")!.textContent).toContain(
+      '"seconds":59'
+    );
+    expect(
+      toast.shadowRoot!.querySelector(".assistive-message")!.textContent
+    ).toContain('"seconds":60');
+
+    const closed = new Promise<void>((resolve) => {
+      toast.addEventListener("toast-closed", () => resolve(), { once: true });
+    });
+    manager.shadowRoot!.querySelector<HTMLElement>("ha-button")!.click();
+    await closed;
+    await manager.updateComplete;
+
+    expect(action).toHaveBeenCalledOnce();
+    expect(manager.shadowRoot!.querySelector("ha-toast")).toBeNull();
+  });
+});
@@ -0,0 +1,245 @@
+import { html, LitElement } from "lit";
+import { customElement, property } from "lit/decorators";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import type { HomeAssistant } from "../../src/types";
+import "../../src/managers/notification-manager";
+
+const localize = vi.fn((key: string, args?: Record<string, string | number>) =>
+  args ? `${key}:${JSON.stringify(args)}` : key
+);
+
+vi.mock("../../src/components/ha-button", () => {
+  customElements.define("ha-button", class extends HTMLElement {});
+  return {};
+});
+
+vi.mock("../../src/components/ha-icon-button", () => {
+  customElements.define("ha-icon-button", class extends HTMLElement {});
+  return {};
+});
+
+vi.mock("../../src/components/ha-toast", () => {
+  customElements.define(
+    "ha-toast",
+    class extends HTMLElement {
+      public show = vi.fn();
+
+      public hide = vi.fn();
+    }
+  );
+  return {};
+});
+
+@customElement("test-notification-manager-host")
+class TestNotificationManagerHost extends LitElement {
+  @property({ attribute: false }) public hass = {
+    localize,
+  } as unknown as HomeAssistant;
+
+  protected render() {
+    return html`<notification-manager
+      .hass=${this.hass}
+    ></notification-manager>`;
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "test-notification-manager-host": TestNotificationManagerHost;
+  }
+}
+
+let host: TestNotificationManagerHost | undefined;
+
+const mountManager = async () => {
+  host = document.createElement(
+    "test-notification-manager-host"
+  ) as TestNotificationManagerHost;
+  document.body.append(host);
+  await host.updateComplete;
+  return host.shadowRoot!.querySelector("notification-manager")!;
+};
+
+const deferred = () => {
+  let resolve: () => void;
+  const promise = new Promise<void>((res) => {
+    resolve = res;
+  });
+  return { promise, resolve: resolve! };
+};
+
+afterEach(() => {
+  host?.remove();
+  host = undefined;
+  vi.clearAllMocks();
+});
+
+describe("notification-manager", () => {
+  it("shows a message with the default duration", async () => {
+    const manager = await mountManager();
+
+    await manager.showDialog({ message: "Configuration saved" });
+
+    const toast = manager.shadowRoot!.querySelector("ha-toast")!;
+    expect(toast.labelText).toBe("Configuration saved");
+    expect(toast.timeoutMs).toBe(4000);
+    expect(toast.bottomOffset).toBe(0);
+    expect(toast.show).toHaveBeenCalledOnce();
+  });
+
+  it("renders a dismiss button and closes with the dismiss reason", async () => {
+    const manager = await mountManager();
+
+    await manager.showDialog({
+      message: "Connection lost",
+      dismissable: true,
+      duration: -1,
+      bottomOffset: 16,
+    });
+
+    const toast = manager.shadowRoot!.querySelector("ha-toast")!;
+    expect(toast.timeoutMs).toBe(-1);
+    expect(toast.bottomOffset).toBe(16);
+
+    manager.shadowRoot!.querySelector<HTMLElement>("ha-icon-button")!.click();
+    expect(toast.hide).toHaveBeenCalledWith("dismiss");
+  });
+
+  it("clears the current notification when duration is zero", async () => {
+    const manager = await mountManager();
+    await manager.showDialog({ message: "First message", duration: -1 });
+
+    await manager.showDialog({ message: "", duration: 0 });
+    await manager.updateComplete;
+
+    expect(manager.shadowRoot!.querySelector("ha-toast")).toBeNull();
+  });
+
+  it.each([
+    { duration: 1, expected: 4000 },
+    { duration: 4000, expected: 4000 },
+    { duration: 4001, expected: 4001 },
+    { duration: -1, expected: -1 },
+  ])(
+    "normalizes a $duration ms duration to $expected ms",
+    async ({ duration, expected }) => {
+      const manager = await mountManager();
+
+      await manager.showDialog({ message: "Message", duration });
+
+      expect(manager.shadowRoot!.querySelector("ha-toast")!.timeoutMs).toBe(
+        expected
+      );
+    }
+  );
+
+  it("localizes visible and assistive messages with numeric arguments", async () => {
+    const manager = await mountManager();
+
+    await manager.showDialog({
+      message: {
+        translationKey: "ui.notification_toast.new_version_available",
+        args: { seconds: 59 },
+      },
+      announceMessage: {
+        translationKey: "ui.notification_toast.new_version_available",
+        args: { seconds: 60 },
+      },
+    });
+
+    const toast = manager.shadowRoot!.querySelector("ha-toast")!;
+    expect(toast.labelText).toContain('"seconds":59');
+    expect(toast.announceText).toContain('"seconds":60');
+    expect(localize).toHaveBeenCalledWith(
+      "ui.notification_toast.new_version_available",
+      { seconds: 59 }
+    );
+    expect(localize).toHaveBeenCalledWith(
+      "ui.notification_toast.new_version_available",
+      { seconds: 60 }
+    );
+  });
+
+  it("renders and invokes primary and secondary actions", async () => {
+    const manager = await mountManager();
+    const primary = vi.fn();
+    const secondary = vi.fn();
+
+    await manager.showDialog({
+      message: "Update available",
+      action: { action: primary, primary: true, text: "Update now" },
+      secondaryAction: { action: secondary, text: "Cancel" },
+      duration: -1,
+    });
+
+    const toast = manager.shadowRoot!.querySelector("ha-toast")!;
+    const buttons = manager.shadowRoot!.querySelectorAll("ha-button");
+    expect(buttons).toHaveLength(2);
+    expect(buttons[0].textContent?.trim()).toBe("Cancel");
+    expect(buttons[0].getAttribute("appearance")).toBe("plain");
+    expect(buttons[1].textContent?.trim()).toBe("Update now");
+    expect(buttons[1].getAttribute("appearance")).toBe("filled");
+
+    buttons[0].click();
+    expect(toast.hide).toHaveBeenLastCalledWith("action");
+    expect(secondary).toHaveBeenCalledOnce();
+    expect(primary).not.toHaveBeenCalled();
+
+    buttons[1].click();
+    expect(toast.hide).toHaveBeenLastCalledWith("action");
+    expect(primary).toHaveBeenCalledOnce();
+  });
+
+  it("keeps a same-ID toast visible while replacing its content", async () => {
+    const manager = await mountManager();
+    await manager.showDialog({ id: "status", message: "First" });
+    const toast = manager.shadowRoot!.querySelector("ha-toast")!;
+    vi.mocked(toast.hide).mockClear();
+
+    await manager.showDialog({ id: "status", message: "Second" });
+
+    expect(toast.hide).not.toHaveBeenCalled();
+    expect(toast.labelText).toBe("Second");
+  });
+
+  it("hides a toast before replacing it with a different ID", async () => {
+    const manager = await mountManager();
+    await manager.showDialog({ id: "first", message: "First" });
+    const toast = manager.shadowRoot!.querySelector("ha-toast")!;
+    vi.mocked(toast.hide).mockClear();
+
+    await manager.showDialog({ id: "second", message: "Second" });
+
+    expect(toast.hide).toHaveBeenCalledOnce();
+    expect(toast.labelText).toBe("Second");
+  });
+
+  it("ignores a stale replacement after a newer notification starts", async () => {
+    const manager = await mountManager();
+    await manager.showDialog({ id: "first", message: "First" });
+    const toast = manager.shadowRoot!.querySelector("ha-toast")!;
+    const delayedHide = deferred();
+    vi.mocked(toast.hide).mockReturnValueOnce(delayedHide.promise);
+
+    const staleShow = manager.showDialog({ id: "second", message: "Second" });
+    await manager.showDialog({ id: "third", message: "Third" });
+    delayedHide.resolve();
+    await staleShow;
+
+    expect(toast.labelText).toBe("Third");
+  });
+
+  it("clears rendered state after the toast closes", async () => {
+    const manager = await mountManager();
+    await manager.showDialog({ message: "Message" });
+    manager.shadowRoot!.querySelector("ha-toast")!.dispatchEvent(
+      new CustomEvent("toast-closed", {
+        detail: { reason: "programmatic" },
+      })
+    );
+
+    await manager.updateComplete;
+
+    expect(manager.shadowRoot!.querySelector("ha-toast")).toBeNull();
+  });
+});
@@ -0,0 +1,368 @@
+import { consume } from "@lit/context";
+import { LitElement } from "lit";
+import { state } from "lit/decorators";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import {
+  dirtyStateContext,
+  type DirtyStateContext,
+} from "../../src/data/context/dirty-state";
+import type { CompareStrategy } from "../../src/mixins/dirty-state-provider-mixin";
+import { DirtyStateProviderMixin } from "../../src/mixins/dirty-state-provider-mixin";
+
+interface TestState {
+  name: string;
+  enabled: boolean;
+  options?: { mode: string };
+}
+
+class TestDirtyStateConsumer extends LitElement {
+  @consume({ context: dirtyStateContext, subscribe: true })
+  @state()
+  public dirtyState?: DirtyStateContext;
+}
+
+customElements.define("test-dirty-state-consumer", TestDirtyStateConsumer);
+
+class TestDirtyStateProvider extends DirtyStateProviderMixin<TestState>()(
+  LitElement
+) {
+  public initialize(
+    strategy: CompareStrategy<TestState>,
+    value?: TestState,
+    normalize?: (value: TestState) => TestState
+  ) {
+    this._initDirtyTracking(strategy, value, normalize);
+  }
+
+  public setValue(value: TestState) {
+    this._updateDirtyState(value);
+  }
+
+  public markClean() {
+    this._markDirtyStateClean();
+  }
+
+  public discardChanges() {
+    this._discardDirtyStateChanges();
+  }
+}
+
+customElements.define("test-dirty-state-provider", TestDirtyStateProvider);
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "test-dirty-state-consumer": TestDirtyStateConsumer;
+    "test-dirty-state-provider": TestDirtyStateProvider;
+  }
+}
+
+let provider: TestDirtyStateProvider | undefined;
+
+const mountProvider = async () => {
+  provider = document.createElement(
+    "test-dirty-state-provider"
+  ) as TestDirtyStateProvider;
+  document.body.append(provider);
+  await provider.updateComplete;
+  return provider;
+};
+
+afterEach(() => {
+  document.querySelectorAll("test-dirty-state-provider").forEach((element) => {
+    element.remove();
+  });
+  provider = undefined;
+  window.isDirtyState = false;
+});
+
+describe("DirtyStateProviderMixin", () => {
+  it("tracks changes against an initial state", async () => {
+    const element = await mountProvider();
+    element.initialize(
+      { type: "shallow" },
+      { name: "Kitchen", enabled: false }
+    );
+    await element.updateComplete;
+
+    expect(element.isDirtyState).toBe(false);
+
+    element.setValue({ name: "Kitchen light", enabled: false });
+    await element.updateComplete;
+    expect(element.isDirtyState).toBe(true);
+
+    element.setValue({ name: "Kitchen", enabled: false });
+    await element.updateComplete;
+    expect(element.isDirtyState).toBe(false);
+  });
+
+  it("marks the current state as clean", async () => {
+    const element = await mountProvider();
+    element.initialize(
+      { type: "shallow" },
+      { name: "Kitchen", enabled: false }
+    );
+    element.setValue({ name: "Kitchen light", enabled: false });
+    await element.updateComplete;
+
+    element.markClean();
+    await element.updateComplete;
+    expect(element.isDirtyState).toBe(false);
+
+    element.setValue({ name: "Kitchen", enabled: false });
+    await element.updateComplete;
+    expect(element.isDirtyState).toBe(true);
+  });
+
+  it("discards changes back to the initial state", async () => {
+    const element = await mountProvider();
+    element.initialize(
+      { type: "shallow" },
+      { name: "Kitchen", enabled: false }
+    );
+    element.setValue({ name: "Kitchen light", enabled: true });
+    await element.updateComplete;
+
+    element.discardChanges();
+    await element.updateComplete;
+
+    expect(element.isDirtyState).toBe(false);
+    expect(element.isEffectiveDirtyState).toBe(false);
+  });
+
+  it("uses deep comparison for nested values", async () => {
+    const element = await mountProvider();
+    element.initialize(
+      { type: "deep" },
+      { name: "Kitchen", enabled: false, options: { mode: "auto" } }
+    );
+    element.setValue({
+      name: "Kitchen",
+      enabled: false,
+      options: { mode: "auto" },
+    });
+    await element.updateComplete;
+
+    expect(element.isDirtyState).toBe(false);
+
+    element.setValue({
+      name: "Kitchen",
+      enabled: false,
+      options: { mode: "manual" },
+    });
+    await element.updateComplete;
+    expect(element.isDirtyState).toBe(true);
+  });
+
+  it("uses reference comparison for nested values with a shallow strategy", async () => {
+    const element = await mountProvider();
+    element.initialize(
+      { type: "shallow" },
+      { name: "Kitchen", enabled: false, options: { mode: "auto" } }
+    );
+    element.setValue({
+      name: "Kitchen",
+      enabled: false,
+      options: { mode: "auto" },
+    });
+    await element.updateComplete;
+
+    expect(element.isDirtyState).toBe(true);
+  });
+
+  it("supports a custom comparison strategy", async () => {
+    const element = await mountProvider();
+    const compare = vi.fn(
+      (initial: TestState, current: TestState) =>
+        initial.name.toLowerCase() === current.name.toLowerCase()
+    );
+    element.initialize(
+      { type: "custom", compare },
+      { name: "Kitchen", enabled: false }
+    );
+    element.setValue({ name: "KITCHEN", enabled: true });
+    await element.updateComplete;
+
+    expect(element.isDirtyState).toBe(false);
+    expect(compare).toHaveBeenCalled();
+  });
+
+  it("keeps the deep baseline isolated from initial state mutations", async () => {
+    const element = await mountProvider();
+    const initial = {
+      name: "Kitchen",
+      enabled: false,
+      options: { mode: "auto" },
+    };
+    element.initialize({ type: "deep" }, initial);
+    initial.options.mode = "manual";
+    element.setValue({
+      name: "Kitchen",
+      enabled: false,
+      options: { mode: "auto" },
+    });
+    await element.updateComplete;
+
+    expect(element.isDirtyState).toBe(false);
+  });
+
+  it("uses the first deferred value as its baseline", async () => {
+    const element = await mountProvider();
+    element.initialize({ type: "shallow" });
+    element.setValue({ name: "Kitchen", enabled: false });
+    await element.updateComplete;
+    expect(element.isDirtyState).toBe(false);
+
+    element.setValue({ name: "Bedroom", enabled: false });
+    await element.updateComplete;
+    expect(element.isDirtyState).toBe(true);
+  });
+
+  it("tracks raw and effective dirty state separately", async () => {
+    const element = await mountProvider();
+    element.initialize(
+      { type: "shallow" },
+      { name: "Kitchen", enabled: false },
+      (value) => ({ ...value, enabled: false })
+    );
+    element.setValue({ name: "Kitchen", enabled: true });
+    await element.updateComplete;
+
+    expect(element.isDirtyState).toBe(true);
+    expect(element.isEffectiveDirtyState).toBe(false);
+  });
+
+  it("publishes dirty and clean transitions with event details", async () => {
+    const listener = vi.fn();
+    window.addEventListener("dirty-state-changed", listener);
+    const element = await mountProvider();
+    element.initialize(
+      { type: "shallow" },
+      { name: "Kitchen", enabled: false }
+    );
+    await element.updateComplete;
+    listener.mockClear();
+
+    element.setValue({ name: "Bedroom", enabled: false });
+    await element.updateComplete;
+    element.setValue({ name: "Kitchen", enabled: false });
+    await element.updateComplete;
+
+    expect(listener).toHaveBeenCalledTimes(2);
+    expect(listener.mock.calls[0][0].detail).toEqual({ isDirty: true });
+    expect(listener.mock.calls[1][0].detail).toEqual({ isDirty: false });
+    expect(window.isDirtyState).toBe(false);
+    window.removeEventListener("dirty-state-changed", listener);
+  });
+
+  it("clears published dirty state when disconnected", async () => {
+    const listener = vi.fn();
+    window.addEventListener("dirty-state-changed", listener);
+    const element = await mountProvider();
+    element.initialize(
+      { type: "shallow" },
+      { name: "Kitchen", enabled: false }
+    );
+    element.setValue({ name: "Bedroom", enabled: false });
+    await element.updateComplete;
+    listener.mockClear();
+
+    element.remove();
+
+    expect(window.isDirtyState).toBe(false);
+    expect(listener).toHaveBeenCalledOnce();
+    expect(listener.mock.calls[0][0].detail).toEqual({ isDirty: false });
+    window.removeEventListener("dirty-state-changed", listener);
+  });
+
+  it("hands global dirty state to the next provider after disconnecting", async () => {
+    const firstProvider = await mountProvider();
+    firstProvider.initialize(
+      { type: "shallow" },
+      { name: "Kitchen", enabled: false }
+    );
+    firstProvider.setValue({ name: "Bedroom", enabled: false });
+    await firstProvider.updateComplete;
+    expect(window.isDirtyState).toBe(true);
+
+    firstProvider.remove();
+    expect(window.isDirtyState).toBe(false);
+
+    const nextProvider = await mountProvider();
+    nextProvider.initialize(
+      { type: "shallow" },
+      { name: "Hallway", enabled: false }
+    );
+    nextProvider.setValue({ name: "Hallway", enabled: true });
+    await nextProvider.updateComplete;
+
+    expect(window.isDirtyState).toBe(true);
+  });
+
+  it("stays globally dirty while any connected provider is dirty", async () => {
+    const dirtyProvider = await mountProvider();
+    dirtyProvider.initialize(
+      { type: "shallow" },
+      { name: "Kitchen", enabled: false }
+    );
+    dirtyProvider.setValue({ name: "Bedroom", enabled: false });
+    await dirtyProvider.updateComplete;
+
+    const cleanProvider = document.createElement("test-dirty-state-provider");
+    document.body.append(cleanProvider);
+    cleanProvider.initialize(
+      { type: "shallow" },
+      { name: "Hallway", enabled: false }
+    );
+    await cleanProvider.updateComplete;
+
+    expect(window.isDirtyState).toBe(true);
+
+    cleanProvider.remove();
+
+    expect(window.isDirtyState).toBe(true);
+
+    dirtyProvider.setValue({ name: "Kitchen", enabled: false });
+    await dirtyProvider.updateComplete;
+
+    expect(window.isDirtyState).toBe(false);
+  });
+
+  it("restores a provider's dirty state after reconnecting", async () => {
+    const element = await mountProvider();
+    element.initialize(
+      { type: "shallow" },
+      { name: "Kitchen", enabled: false }
+    );
+    element.setValue({ name: "Bedroom", enabled: false });
+    await element.updateComplete;
+
+    element.remove();
+    expect(window.isDirtyState).toBe(false);
+
+    document.body.append(element);
+
+    expect(window.isDirtyState).toBe(true);
+  });
+
+  it("tracks independent context slices and marks all of them clean", async () => {
+    const element = await mountProvider();
+    element.initialize({ type: "shallow" });
+    const consumer = document.createElement("test-dirty-state-consumer");
+    element.append(consumer);
+    await consumer.updateComplete;
+    const setState = (value: TestState, key: "first" | "second") => {
+      Reflect.apply(consumer.dirtyState!.setState, undefined, [value, key]);
+    };
+
+    setState({ name: "Kitchen", enabled: false }, "first");
+    setState({ name: "Bedroom", enabled: false }, "second");
+    await element.updateComplete;
+    setState({ name: "Kitchen light", enabled: false }, "first");
+    await element.updateComplete;
+    expect(element.isDirtyState).toBe(true);
+
+    consumer.dirtyState!.markClean();
+    await element.updateComplete;
+    expect(element.isDirtyState).toBe(false);
+  });
+});
@@ -0,0 +1,341 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import type { ShowToastParams } from "../../src/managers/notification-manager";
+import {
+  registerServiceWorker,
+  supportsServiceWorker,
+} from "../../src/util/register-service-worker";
+
+class FakeWorker extends EventTarget {
+  public state: ServiceWorkerState = "installing";
+
+  public postMessage = vi.fn();
+}
+
+class FakeRegistration extends EventTarget {
+  public installing: ServiceWorker | null = null;
+
+  public waiting: ServiceWorker | null = null;
+}
+
+class FakeServiceWorkerContainer extends EventTarget {
+  public controller: ServiceWorker | null = null;
+
+  public register = vi.fn();
+}
+
+const serviceWorkerDescriptor = Object.getOwnPropertyDescriptor(
+  navigator,
+  "serviceWorker"
+);
+
+const restoreServiceWorker = () => {
+  if (serviceWorkerDescriptor) {
+    Object.defineProperty(navigator, "serviceWorker", serviceWorkerDescriptor);
+  } else {
+    Reflect.deleteProperty(navigator, "serviceWorker");
+  }
+};
+
+describe("supportsServiceWorker", () => {
+  afterEach(restoreServiceWorker);
+
+  it("returns true when the service worker API is available", () => {
+    Object.defineProperty(navigator, "serviceWorker", {
+      configurable: true,
+      value: new FakeServiceWorkerContainer(),
+    });
+
+    expect(supportsServiceWorker()).toBe(true);
+  });
+
+  it("returns false when the service worker API is unavailable", () => {
+    Reflect.deleteProperty(navigator, "serviceWorker");
+
+    expect(supportsServiceWorker()).toBe(false);
+  });
+});
+
+describe("registerServiceWorker", () => {
+  let root: HTMLElement;
+  let worker: FakeWorker;
+  let registration: FakeRegistration;
+  let serviceWorker: FakeServiceWorkerContainer;
+  let notifications: ShowToastParams[];
+
+  const latestNotification = () => notifications[notifications.length - 1];
+
+  const setDirtyState = (isDirty: boolean) => {
+    window.isDirtyState = isDirty;
+    window.dispatchEvent(
+      new CustomEvent("dirty-state-changed", { detail: { isDirty } })
+    );
+  };
+
+  const installUpdate = () => {
+    registration.installing = worker as unknown as ServiceWorker;
+    registration.dispatchEvent(new Event("updatefound"));
+    worker.state = "installed";
+    worker.dispatchEvent(new Event("statechange"));
+  };
+
+  beforeEach(() => {
+    vi.useFakeTimers();
+    globalThis.__BUILD__ = "modern";
+    globalThis.__DEV__ = false;
+    globalThis.__DEMO__ = false;
+    window.isDirtyState = false;
+    notifications = [];
+    root = document.createElement("div");
+    root.addEventListener("hass-notification", (event) => {
+      notifications.push((event as CustomEvent<ShowToastParams>).detail);
+    });
+    worker = new FakeWorker();
+    registration = new FakeRegistration();
+    serviceWorker = new FakeServiceWorkerContainer();
+    serviceWorker.controller = worker as unknown as ServiceWorker;
+    serviceWorker.register.mockResolvedValue(registration);
+    Object.defineProperty(navigator, "serviceWorker", {
+      configurable: true,
+      value: serviceWorker,
+    });
+  });
+
+  afterEach(() => {
+    latestNotification()?.secondaryAction?.action();
+    vi.clearAllTimers();
+    vi.useRealTimers();
+    window.isDirtyState = false;
+    globalThis.__DEV__ = false;
+    globalThis.__DEMO__ = false;
+    restoreServiceWorker();
+  });
+
+  it("registers the worker for the current build", async () => {
+    await registerServiceWorker(root, false);
+
+    expect(serviceWorker.register).toHaveBeenCalledOnce();
+    expect(serviceWorker.register).toHaveBeenCalledWith("/sw-modern.js");
+  });
+
+  it("does not register when service workers are unsupported", async () => {
+    Reflect.deleteProperty(navigator, "serviceWorker");
+
+    await registerServiceWorker(root);
+
+    expect(serviceWorker.register).not.toHaveBeenCalled();
+  });
+
+  it("listens for controller changes before registering", async () => {
+    const addEventListener = vi.spyOn(serviceWorker, "addEventListener");
+
+    await registerServiceWorker(root, false);
+
+    expect(addEventListener).toHaveBeenCalledWith(
+      "controllerchange",
+      expect.any(Function)
+    );
+    expect(addEventListener.mock.invocationCallOrder[0]).toBeLessThan(
+      serviceWorker.register.mock.invocationCallOrder[0]
+    );
+  });
+
+  it.each([
+    { notifyUpdate: false, dev: false, demo: false },
+    { notifyUpdate: true, dev: true, demo: false },
+    { notifyUpdate: true, dev: false, demo: true },
+  ])(
+    "does not monitor updates with notifyUpdate=$notifyUpdate, dev=$dev, demo=$demo",
+    async ({ notifyUpdate, dev, demo }) => {
+      globalThis.__DEV__ = dev;
+      globalThis.__DEMO__ = demo;
+      const addEventListener = vi.spyOn(registration, "addEventListener");
+
+      await registerServiceWorker(root, notifyUpdate);
+
+      expect(addEventListener).not.toHaveBeenCalledWith(
+        "updatefound",
+        expect.any(Function)
+      );
+    }
+  );
+
+  it("ignores update discovery without an installing worker", async () => {
+    await registerServiceWorker(root);
+
+    registration.dispatchEvent(new Event("updatefound"));
+
+    expect(notifications).toHaveLength(0);
+  });
+
+  it("waits for an installing worker to reach the installed state", async () => {
+    await registerServiceWorker(root);
+    registration.installing = worker as unknown as ServiceWorker;
+    registration.dispatchEvent(new Event("updatefound"));
+
+    worker.state = "activating";
+    worker.dispatchEvent(new Event("statechange"));
+
+    expect(notifications).toHaveLength(0);
+  });
+
+  it("ignores an initial installation without an existing controller", async () => {
+    serviceWorker.controller = null;
+    await registerServiceWorker(root);
+
+    installUpdate();
+
+    expect(notifications).toHaveLength(0);
+  });
+
+  it("starts at 60 seconds when an update is installed", async () => {
+    await registerServiceWorker(root);
+
+    installUpdate();
+
+    expect(latestNotification()).toMatchObject({
+      id: "frontend-update-available",
+      message: {
+        translationKey: "ui.notification_toast.new_version_available",
+        args: { seconds: 60 },
+      },
+      announceMessage: {
+        args: { seconds: 60 },
+      },
+      action: {
+        primary: true,
+        text: { translationKey: "ui.notification_toast.update_now" },
+      },
+      secondaryAction: {
+        text: { translationKey: "ui.common.cancel" },
+      },
+      duration: -1,
+    });
+  });
+
+  it("uses an already waiting worker", async () => {
+    registration.waiting = worker as unknown as ServiceWorker;
+
+    await registerServiceWorker(root);
+
+    expect(latestNotification().message).toMatchObject({
+      args: { seconds: 60 },
+    });
+  });
+
+  it("ignores a waiting worker without an existing controller", async () => {
+    registration.waiting = worker as unknown as ServiceWorker;
+    serviceWorker.controller = null;
+
+    await registerServiceWorker(root);
+
+    expect(notifications).toHaveLength(0);
+  });
+
+  it.each([
+    { elapsed: 1_000, visual: 59, announced: 60 },
+    { elapsed: 20_000, visual: 40, announced: 40 },
+    { elapsed: 40_000, visual: 20, announced: 20 },
+    { elapsed: 55_000, visual: 5, announced: 5 },
+    { elapsed: 59_000, visual: 1, announced: 5 },
+  ])(
+    "shows $visual seconds and announces $announced after $elapsed ms",
+    async ({ elapsed, visual, announced }) => {
+      await registerServiceWorker(root);
+      installUpdate();
+
+      vi.advanceTimersByTime(elapsed);
+
+      expect(latestNotification().message).toMatchObject({
+        args: { seconds: visual },
+      });
+      expect(latestNotification().announceMessage).toMatchObject({
+        args: { seconds: announced },
+      });
+    }
+  );
+
+  it("activates and hides the update when the countdown finishes", async () => {
+    await registerServiceWorker(root);
+    installUpdate();
+
+    vi.advanceTimersByTime(60_000);
+
+    expect(worker.postMessage).toHaveBeenCalledOnce();
+    expect(worker.postMessage).toHaveBeenCalledWith({ type: "skipWaiting" });
+    expect(latestNotification()).toMatchObject({
+      id: "frontend-update-available",
+      message: "",
+      duration: 0,
+    });
+  });
+
+  it("activates and hides the update immediately on request", async () => {
+    await registerServiceWorker(root);
+    installUpdate();
+
+    latestNotification().action!.action();
+
+    expect(worker.postMessage).toHaveBeenCalledOnce();
+    expect(worker.postMessage).toHaveBeenCalledWith({ type: "skipWaiting" });
+    expect(latestNotification()).toMatchObject({ message: "", duration: 0 });
+  });
+
+  it("cancels automatic activation", async () => {
+    await registerServiceWorker(root);
+    installUpdate();
+
+    latestNotification().secondaryAction!.action();
+    vi.advanceTimersByTime(60_000);
+
+    expect(worker.postMessage).not.toHaveBeenCalled();
+  });
+
+  it("defers the message and activation while the page is dirty", async () => {
+    setDirtyState(true);
+    await registerServiceWorker(root);
+    installUpdate();
+
+    expect(notifications).toHaveLength(0);
+    vi.advanceTimersByTime(60_000);
+    expect(worker.postMessage).not.toHaveBeenCalled();
+
+    setDirtyState(false);
+    expect(latestNotification().message).toMatchObject({
+      args: { seconds: 60 },
+    });
+  });
+
+  it("hides and resets the countdown when the page becomes dirty", async () => {
+    await registerServiceWorker(root);
+    installUpdate();
+    vi.advanceTimersByTime(10_000);
+
+    setDirtyState(true);
+
+    expect(latestNotification()).toMatchObject({ message: "", duration: 0 });
+    vi.advanceTimersByTime(60_000);
+    expect(worker.postMessage).not.toHaveBeenCalled();
+
+    setDirtyState(false);
+    expect(latestNotification().message).toMatchObject({
+      args: { seconds: 60 },
+    });
+  });
+
+  it("uses the latest installed worker", async () => {
+    await registerServiceWorker(root);
+    installUpdate();
+    const replacement = new FakeWorker();
+    replacement.state = "installed";
+
+    registration.installing = replacement as unknown as ServiceWorker;
+    registration.dispatchEvent(new Event("updatefound"));
+    replacement.dispatchEvent(new Event("statechange"));
+    vi.advanceTimersByTime(60_000);
+
+    expect(worker.postMessage).not.toHaveBeenCalled();
+    expect(replacement.postMessage).toHaveBeenCalledWith({
+      type: "skipWaiting",
+    });
+  });
+});
@@ -4638,22 +4638,22 @@ __metadata:
  languageName: node
  linkType: hard

-"@rsdoctor/client@npm:1.6.0":
-  version: 1.6.0
-  resolution: "@rsdoctor/client@npm:1.6.0"
-  checksum: 10/c6311104c59978d486146d6e2e80fe2e58c1f783a21a2a5ede6dc2db59ab4db86a2f551b8b54cfad01df06bc28e3def8792cea2fa2f68f07861d4f2b0cf56503
+"@rsdoctor/client@npm:1.6.1":
+  version: 1.6.1
+  resolution: "@rsdoctor/client@npm:1.6.1"
+  checksum: 10/aefc3a378e3ecdc9f03c21272dfb06d4eb68ca5395d83edb0a44fd816ea96b45e894de8c862e605fcb02611d306014ffef4ca09723945cf75c9a33b7062d5d4b
  languageName: node
  linkType: hard

-"@rsdoctor/core@npm:1.6.0":
-  version: 1.6.0
-  resolution: "@rsdoctor/core@npm:1.6.0"
+"@rsdoctor/core@npm:1.6.1":
+  version: 1.6.1
+  resolution: "@rsdoctor/core@npm:1.6.1"
  dependencies:
    "@rsbuild/plugin-check-syntax": "npm:^1.6.1"
-    "@rsdoctor/graph": "npm:1.6.0"
-    "@rsdoctor/sdk": "npm:1.6.0"
-    "@rsdoctor/types": "npm:1.6.0"
-    "@rsdoctor/utils": "npm:1.6.0"
+    "@rsdoctor/graph": "npm:1.6.1"
+    "@rsdoctor/sdk": "npm:1.6.1"
+    "@rsdoctor/types": "npm:1.6.1"
+    "@rsdoctor/utils": "npm:1.6.1"
    "@rspack/resolver": "npm:^0.2.8"
    browserslist-load-config: "npm:^1.0.2"
    es-toolkit: "npm:^1.49.0"
@@ -4661,60 +4661,60 @@ __metadata:
    fs-extra: "npm:^11.1.1"
    semver: "npm:^7.8.5"
    source-map: "npm:^0.7.6"
-  checksum: 10/6e39bd687844fb309dfb294278dec0fcfabc50edd1e42bac51bff30504971a3567bf344156d6cb63078ba441d5f78a3032e8b3cd487598e5a5903f5034dea8ed
+  checksum: 10/de5708e15e1efd67a23d753ed906e573ca6a6857428dbdfea0aff2f85f1ed3f631ff34e23bf40e955855ed878ed548c073c620a4edbd12959c20a3f9ff9c1cfd
  languageName: node
  linkType: hard

-"@rsdoctor/graph@npm:1.6.0":
-  version: 1.6.0
-  resolution: "@rsdoctor/graph@npm:1.6.0"
+"@rsdoctor/graph@npm:1.6.1":
+  version: 1.6.1
+  resolution: "@rsdoctor/graph@npm:1.6.1"
  dependencies:
-    "@rsdoctor/types": "npm:1.6.0"
-    "@rsdoctor/utils": "npm:1.6.0"
+    "@rsdoctor/types": "npm:1.6.1"
+    "@rsdoctor/utils": "npm:1.6.1"
    es-toolkit: "npm:^1.49.0"
    path-browserify: "npm:1.0.1"
    source-map: "npm:^0.7.6"
-  checksum: 10/21ec99112e34f2fd855e44e6f82c4b791a90023b2e5fd23439874b23bc295f8e614134d089eeea2a7f9ec4e482daf539eafbc5af0bd6013a71572cedb8ecd0ef
+  checksum: 10/065c485f11939143021c12a1acff47a2539c22e9a9d5f8501c906578213ca16b71a35d08bc0a83035529d42a7906fc098b6e3c536d895cd13ee74b5340a39e40
  languageName: node
  linkType: hard

-"@rsdoctor/rspack-plugin@npm:1.6.0":
-  version: 1.6.0
-  resolution: "@rsdoctor/rspack-plugin@npm:1.6.0"
+"@rsdoctor/rspack-plugin@npm:1.6.1":
+  version: 1.6.1
+  resolution: "@rsdoctor/rspack-plugin@npm:1.6.1"
  dependencies:
-    "@rsdoctor/core": "npm:1.6.0"
-    "@rsdoctor/graph": "npm:1.6.0"
-    "@rsdoctor/sdk": "npm:1.6.0"
-    "@rsdoctor/types": "npm:1.6.0"
-    "@rsdoctor/utils": "npm:1.6.0"
+    "@rsdoctor/core": "npm:1.6.1"
+    "@rsdoctor/graph": "npm:1.6.1"
+    "@rsdoctor/sdk": "npm:1.6.1"
+    "@rsdoctor/types": "npm:1.6.1"
+    "@rsdoctor/utils": "npm:1.6.1"
  peerDependencies:
    "@rspack/core": "*"
  peerDependenciesMeta:
    "@rspack/core":
      optional: true
-  checksum: 10/88b68253c81a07048f9f33197a50a91381a1587137d822c9fa6fee51c346926f79bc4f57c1cec8afe8639539520b31c1daa74e4a22ce293d8109ef2beff9904e
+  checksum: 10/8908f4a3c2b46fdaba2c6d39dd535623ddcc411fb50d358de949142a5628a512827f5206a93ae975bd93e5de6b72d5cd71f63463c65a37ba718727567187ce8e
  languageName: node
  linkType: hard

-"@rsdoctor/sdk@npm:1.6.0":
-  version: 1.6.0
-  resolution: "@rsdoctor/sdk@npm:1.6.0"
+"@rsdoctor/sdk@npm:1.6.1":
+  version: 1.6.1
+  resolution: "@rsdoctor/sdk@npm:1.6.1"
  dependencies:
-    "@rsdoctor/client": "npm:1.6.0"
-    "@rsdoctor/graph": "npm:1.6.0"
-    "@rsdoctor/types": "npm:1.6.0"
-    "@rsdoctor/utils": "npm:1.6.0"
+    "@rsdoctor/client": "npm:1.6.1"
+    "@rsdoctor/graph": "npm:1.6.1"
+    "@rsdoctor/types": "npm:1.6.1"
+    "@rsdoctor/utils": "npm:1.6.1"
    launch-editor: "npm:^2.13.2"
    safer-buffer: "npm:2.1.2"
    socket.io: "npm:4.8.1"
    tapable: "npm:2.3.3"
-  checksum: 10/f16cb445a6669ae8427b14228de4d049b64ff81b139b5c614663ad7407fe111590fde9cecd1c10a633753d3118ba042c737622720149cf2db5ae2799fa38a673
+  checksum: 10/d667d62d730bed7606bcf1ed2063fb7597024e31d9108c3ba9729313764866407c216499ccb3c7102f239d7d82463e510f2b2ec71270af6a40039cbe6f876d23
  languageName: node
  linkType: hard

-"@rsdoctor/types@npm:1.6.0":
-  version: 1.6.0
-  resolution: "@rsdoctor/types@npm:1.6.0"
+"@rsdoctor/types@npm:1.6.1":
+  version: 1.6.1
+  resolution: "@rsdoctor/types@npm:1.6.1"
  dependencies:
    "@types/connect": "npm:3.4.38"
    "@types/estree": "npm:1.0.5"
@@ -4728,16 +4728,16 @@ __metadata:
      optional: true
    webpack:
      optional: true
-  checksum: 10/7348ceaab14d2d5365ca038b3b555576034456c6a135b4cd2bff6d2eef9039072492d3cdcb0841f609a49197dbcbc9005c89026b89370e25f1aa7231fb484942
+  checksum: 10/1c4ae6c1aa6fa525d65ab78396954d86358880959ee3fdb68247c2f3215a35e4cb2aab3836cb82f6c208c2c3834cfe0dc8bf575ba59fd8e2ff89ffc92322fcad
  languageName: node
  linkType: hard

-"@rsdoctor/utils@npm:1.6.0":
-  version: 1.6.0
-  resolution: "@rsdoctor/utils@npm:1.6.0"
+"@rsdoctor/utils@npm:1.6.1":
+  version: 1.6.1
+  resolution: "@rsdoctor/utils@npm:1.6.1"
  dependencies:
    "@babel/code-frame": "npm:7.26.2"
-    "@rsdoctor/types": "npm:1.6.0"
+    "@rsdoctor/types": "npm:1.6.1"
    "@types/estree": "npm:1.0.5"
    acorn: "npm:^8.10.0"
    acorn-import-attributes: "npm:^1.9.5"
@@ -4751,69 +4751,69 @@ __metadata:
    picocolors: "npm:^1.1.1"
    rslog: "npm:^2.1.2"
    strip-ansi: "npm:^7.2.0"
-  checksum: 10/a01a68837abf5e47d979757bb8b59f68838beaf80a85acc462e89671155adf51fed68ac41780aeb36eae45e93baff1269757446970e58d5663b2ad5661db465a
+  checksum: 10/11f4e9136dd849fa05b0ab56ab0de3be3de43880d530dcbfb1835780dccad9976636f6a743852893948ae053e71fb7cd6144cac3ffac27929a87710e3981c048
  languageName: node
  linkType: hard

-"@rspack/binding-darwin-arm64@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding-darwin-arm64@npm:2.1.4"
+"@rspack/binding-darwin-arm64@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding-darwin-arm64@npm:2.1.5"
  conditions: os=darwin & cpu=arm64
  languageName: node
  linkType: hard

-"@rspack/binding-darwin-x64@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding-darwin-x64@npm:2.1.4"
+"@rspack/binding-darwin-x64@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding-darwin-x64@npm:2.1.5"
  conditions: os=darwin & cpu=x64
  languageName: node
  linkType: hard

-"@rspack/binding-linux-arm64-gnu@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding-linux-arm64-gnu@npm:2.1.4"
+"@rspack/binding-linux-arm64-gnu@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding-linux-arm64-gnu@npm:2.1.5"
  conditions: os=linux & cpu=arm64 & libc=glibc
  languageName: node
  linkType: hard

-"@rspack/binding-linux-arm64-musl@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding-linux-arm64-musl@npm:2.1.4"
+"@rspack/binding-linux-arm64-musl@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding-linux-arm64-musl@npm:2.1.5"
  conditions: os=linux & cpu=arm64 & libc=musl
  languageName: node
  linkType: hard

-"@rspack/binding-linux-riscv64-gnu@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding-linux-riscv64-gnu@npm:2.1.4"
+"@rspack/binding-linux-riscv64-gnu@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding-linux-riscv64-gnu@npm:2.1.5"
  conditions: os=linux & cpu=riscv64 & libc=glibc
  languageName: node
  linkType: hard

-"@rspack/binding-linux-riscv64-musl@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding-linux-riscv64-musl@npm:2.1.4"
+"@rspack/binding-linux-riscv64-musl@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding-linux-riscv64-musl@npm:2.1.5"
  conditions: os=linux & cpu=riscv64 & libc=musl
  languageName: node
  linkType: hard

-"@rspack/binding-linux-x64-gnu@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding-linux-x64-gnu@npm:2.1.4"
+"@rspack/binding-linux-x64-gnu@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding-linux-x64-gnu@npm:2.1.5"
  conditions: os=linux & cpu=x64 & libc=glibc
  languageName: node
  linkType: hard

-"@rspack/binding-linux-x64-musl@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding-linux-x64-musl@npm:2.1.4"
+"@rspack/binding-linux-x64-musl@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding-linux-x64-musl@npm:2.1.5"
  conditions: os=linux & cpu=x64 & libc=musl
  languageName: node
  linkType: hard

-"@rspack/binding-wasm32-wasi@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding-wasm32-wasi@npm:2.1.4"
+"@rspack/binding-wasm32-wasi@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding-wasm32-wasi@npm:2.1.5"
  dependencies:
    "@emnapi/core": "npm:1.11.2"
    "@emnapi/runtime": "npm:1.11.2"
@@ -4822,43 +4822,43 @@ __metadata:
  languageName: node
  linkType: hard

-"@rspack/binding-win32-arm64-msvc@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding-win32-arm64-msvc@npm:2.1.4"
+"@rspack/binding-win32-arm64-msvc@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding-win32-arm64-msvc@npm:2.1.5"
  conditions: os=win32 & cpu=arm64
  languageName: node
  linkType: hard

-"@rspack/binding-win32-ia32-msvc@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding-win32-ia32-msvc@npm:2.1.4"
+"@rspack/binding-win32-ia32-msvc@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding-win32-ia32-msvc@npm:2.1.5"
  conditions: os=win32 & cpu=ia32
  languageName: node
  linkType: hard

-"@rspack/binding-win32-x64-msvc@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding-win32-x64-msvc@npm:2.1.4"
+"@rspack/binding-win32-x64-msvc@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding-win32-x64-msvc@npm:2.1.5"
  conditions: os=win32 & cpu=x64
  languageName: node
  linkType: hard

-"@rspack/binding@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/binding@npm:2.1.4"
+"@rspack/binding@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/binding@npm:2.1.5"
  dependencies:
-    "@rspack/binding-darwin-arm64": "npm:2.1.4"
-    "@rspack/binding-darwin-x64": "npm:2.1.4"
-    "@rspack/binding-linux-arm64-gnu": "npm:2.1.4"
-    "@rspack/binding-linux-arm64-musl": "npm:2.1.4"
-    "@rspack/binding-linux-riscv64-gnu": "npm:2.1.4"
-    "@rspack/binding-linux-riscv64-musl": "npm:2.1.4"
-    "@rspack/binding-linux-x64-gnu": "npm:2.1.4"
-    "@rspack/binding-linux-x64-musl": "npm:2.1.4"
-    "@rspack/binding-wasm32-wasi": "npm:2.1.4"
-    "@rspack/binding-win32-arm64-msvc": "npm:2.1.4"
-    "@rspack/binding-win32-ia32-msvc": "npm:2.1.4"
-    "@rspack/binding-win32-x64-msvc": "npm:2.1.4"
+    "@rspack/binding-darwin-arm64": "npm:2.1.5"
+    "@rspack/binding-darwin-x64": "npm:2.1.5"
+    "@rspack/binding-linux-arm64-gnu": "npm:2.1.5"
+    "@rspack/binding-linux-arm64-musl": "npm:2.1.5"
+    "@rspack/binding-linux-riscv64-gnu": "npm:2.1.5"
+    "@rspack/binding-linux-riscv64-musl": "npm:2.1.5"
+    "@rspack/binding-linux-x64-gnu": "npm:2.1.5"
+    "@rspack/binding-linux-x64-musl": "npm:2.1.5"
+    "@rspack/binding-wasm32-wasi": "npm:2.1.5"
+    "@rspack/binding-win32-arm64-msvc": "npm:2.1.5"
+    "@rspack/binding-win32-ia32-msvc": "npm:2.1.5"
+    "@rspack/binding-win32-x64-msvc": "npm:2.1.5"
  dependenciesMeta:
    "@rspack/binding-darwin-arm64":
      optional: true
@@ -4884,15 +4884,15 @@ __metadata:
      optional: true
    "@rspack/binding-win32-x64-msvc":
      optional: true
-  checksum: 10/425bf152dba708992ce16114ce6bc8dfa424071694e85201317518dce1899eeae873a2adbd23b214bb8d223f7290e000fd78ad9bf262c633e12d3d4ff73bbdcd
+  checksum: 10/d1054348d3ba734485f977d574c6311311707adfcc5e53f03c8dbbbdc5778cff9b815e1d675992e2832241606d4cce7678acc3999b259139120b4ec30751f1e1
  languageName: node
  linkType: hard

-"@rspack/core@npm:2.1.4":
-  version: 2.1.4
-  resolution: "@rspack/core@npm:2.1.4"
+"@rspack/core@npm:2.1.5":
+  version: 2.1.5
+  resolution: "@rspack/core@npm:2.1.5"
  dependencies:
-    "@rspack/binding": "npm:2.1.4"
+    "@rspack/binding": "npm:2.1.5"
  peerDependencies:
    "@module-federation/runtime-tools": ^0.24.1 || ^2.0.0
    "@swc/helpers": ^0.5.23
@@ -4901,7 +4901,7 @@ __metadata:
      optional: true
    "@swc/helpers":
      optional: true
-  checksum: 10/3c7aa9e8dbe8b132b51fc017a6c2c76ddf346cf663cad2a8912ba61469d80468acd045503d405bf962bb5ec44f44036512dd6d6233ea6d1419979e5c17e1dbd8
+  checksum: 10/714064de701211724f7d859bc269d357fa2ad2f7ea0ac34d1e4e48b534981cf3961bd723c0659b9c093330f04e01e16a0c5587d6a18301727e27d717f764ded7
  languageName: node
  linkType: hard

@@ -7671,10 +7671,10 @@ __metadata:
  languageName: node
  linkType: hard

-"color-name@npm:2.1.0":
-  version: 2.1.0
-  resolution: "color-name@npm:2.1.0"
-  checksum: 10/eb014f71d87408e318e95d3f554f188370d354ba8e0ffa4341d0fd19de391bfe2bc96e563d4f6614644d676bc24f475560dffee3fe310c2d6865d007410a9a2b
+"color-name@npm:2.1.1":
+  version: 2.1.1
+  resolution: "color-name@npm:2.1.1"
+  checksum: 10/17bbb03a1e64299e5f61ccc514c502baf66980b88d013ca0161e8c0009edc3813ab3ffc8558ae99b8633d23c2e94b6551a248015b86cb5f3a84b645b4d0f3bb5
  languageName: node
  linkType: hard

@@ -9954,8 +9954,8 @@ __metadata:
    "@octokit/rest": "npm:22.0.1"
    "@playwright/test": "npm:1.61.1"
    "@replit/codemirror-indentation-markers": "npm:6.5.3"
-    "@rsdoctor/rspack-plugin": "npm:1.6.0"
-    "@rspack/core": "npm:2.1.4"
+    "@rsdoctor/rspack-plugin": "npm:1.6.1"
+    "@rspack/core": "npm:2.1.5"
    "@rspack/dev-server": "npm:2.1.0"
    "@swc/helpers": "npm:0.5.23"
    "@thomasloven/round-slider": "npm:0.6.0"
@@ -9986,7 +9986,7 @@ __metadata:
    barcode-detector: "npm:3.2.1"
    browserslist-useragent-regexp: "npm:4.1.4"
    cally: "npm:0.9.2"
-    color-name: "npm:2.1.0"
+    color-name: "npm:2.1.1"
    comlink: "npm:4.4.2"
    core-js: "npm:3.49.0"
    cropperjs: "npm:1.6.2"
@@ -10023,14 +10023,14 @@ __metadata:
    husky: "npm:9.1.7"
    idb-keyval: "npm:6.3.0"
    intl-messageformat: "npm:11.2.12"
-    js-yaml: "npm:5.2.1"
+    js-yaml: "npm:5.2.2"
    jsdom: "npm:29.1.1"
    jszip: "npm:3.10.1"
    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"
    license-checker-rseidelsohn: "npm:5.0.1"
-    lint-staged: "npm:17.1.0"
+    lint-staged: "npm:17.2.0"
    lit: "npm:3.3.3"
    lit-analyzer: "npm:2.0.3"
    lit-html: "npm:3.3.3"
@@ -10044,7 +10044,7 @@ __metadata:
    node-vibrant: "npm:4.0.4"
    object-hash: "npm:3.0.0"
    pinst: "npm:3.0.0"
-    prettier: "npm:3.9.5"
+    prettier: "npm:3.9.6"
    punycode: "npm:2.3.1"
    qr-scanner: "npm:1.4.2"
    qrcode: "npm:1.5.4"
@@ -10056,7 +10056,7 @@ __metadata:
    sortablejs: "patch:sortablejs@npm%3A1.15.6#~/.yarn/patches/sortablejs-npm-1.15.6-3235a8f83b.patch"
    stacktrace-js: "npm:2.0.2"
    superstruct: "npm:2.0.2"
-    tar: "npm:7.5.20"
+    tar: "npm:7.5.21"
    terser-webpack-plugin: "npm:5.6.1"
    tinykeys: "patch:tinykeys@npm%3A4.0.0#~/.yarn/patches/tinykeys-npm-4.0.0-a6ca3fd771.patch"
    ts-lit-plugin: "npm:2.0.2"
@@ -10957,14 +10957,14 @@ __metadata:
  languageName: node
  linkType: hard

-"js-yaml@npm:5.2.1":
-  version: 5.2.1
-  resolution: "js-yaml@npm:5.2.1"
+"js-yaml@npm:5.2.2":
+  version: 5.2.2
+  resolution: "js-yaml@npm:5.2.2"
  dependencies:
    argparse: "npm:^2.0.1"
  bin:
    js-yaml: bin/js-yaml.mjs
-  checksum: 10/e1eca2d21c15572585bb236d9fde31d6789eb50b9c63e8753fa7e0777bc480f7521cad517bd7a0c66f27dfc27ddcd7100beeefa51c1a50e10e98f2e009633c3d
+  checksum: 10/2b4c2933af12c97e1c4894a4f27fe9b06dab70a64a96bb50624b4429bef6bf11008bde20d868bce52a36784473314efc30078ba6025b58cf7537961e23b1ae9c
  languageName: node
  linkType: hard

@@ -11423,9 +11423,9 @@ __metadata:
  languageName: node
  linkType: hard

-"lint-staged@npm:17.1.0":
-  version: 17.1.0
-  resolution: "lint-staged@npm:17.1.0"
+"lint-staged@npm:17.2.0":
+  version: 17.2.0
+  resolution: "lint-staged@npm:17.2.0"
  dependencies:
    picomatch: "npm:^4.0.5"
    string-argv: "npm:^0.3.2"
@@ -11436,7 +11436,7 @@ __metadata:
      optional: true
  bin:
    lint-staged: bin/lint-staged.js
-  checksum: 10/050d8ce1f6c2cf218ebc0b693de6d1754b333f04e263ecbee230b1aa742fd684667d0f42beee48c3bb11cbcc4e50c4995289c82c36bb08f6bd0f8157816514e1
+  checksum: 10/7c26129d6dd27f20d8fc8d70b13252f15baf569124721d7f5e9ed289e054ed43f5cc2a35de4129b65a7c7f1ad4a5900859a7488f8a1f0b96428b995b29ec2ba8
  languageName: node
  linkType: hard

@@ -12878,12 +12878,12 @@ __metadata:
  languageName: node
  linkType: hard

-"prettier@npm:3.9.5":
-  version: 3.9.5
-  resolution: "prettier@npm:3.9.5"
+"prettier@npm:3.9.6":
+  version: 3.9.6
+  resolution: "prettier@npm:3.9.6"
  bin:
    prettier: bin/prettier.cjs
-  checksum: 10/b6587f1582ba653ce5207ee227aff646500e5098646931088f176d1ab090b1f47d5a333f1facd634e9aa7dcb15c45940e2cec13a5962534cf0200617517b67b6
+  checksum: 10/1dd1a1e0e40ec3b91cda9d294c4a95022aef61880ca3f441aad99b1252279f58a766c4cece81132c01550dcff1fd445efbd8812ea4a2374313e7fc6c8136f11f
  languageName: node
  linkType: hard

@@ -14501,16 +14501,16 @@ __metadata:
  languageName: node
  linkType: hard

-"tar@npm:*, tar@npm:7.5.20, tar@npm:^7.4.3, tar@npm:^7.5.4":
-  version: 7.5.20
-  resolution: "tar@npm:7.5.20"
+"tar@npm:*, tar@npm:7.5.21, tar@npm:^7.4.3, tar@npm:^7.5.4":
+  version: 7.5.21
+  resolution: "tar@npm:7.5.21"
  dependencies:
    "@isaacs/fs-minipass": "npm:^4.0.0"
    chownr: "npm:^3.0.0"
    minipass: "npm:^7.1.2"
    minizlib: "npm:^3.1.0"
    yallist: "npm:^5.0.0"
-  checksum: 10/90a0fe423ac921197ad5eefc5e5f7ad7f42b06e80444c8c347c1e4112384cbe9cb53ade3ef71748eed3684888756869c2aeef6b6303c766101f3217e254d4be9
+  checksum: 10/a1b7dcee15e4f7dbef7f07c3cf0fe946248efabd1cb029b54c698d817dfc2876c75bcaa164a12dd21191e385759ce3e37fea562cf4aabaa00984ef9ed3c48d17
  languageName: node
  linkType: hard
Author	SHA1	Message	Date
Petar Petrov	2b11459cf6	Fix chart down sampling collapsing the series when the chart is hidden	2026-07-26 19:21:23 +03:00
Paulus Schoutsen	18de8b13d3	Add a home page demo to the demo (#53311 ) * Fix mocked entity states and demo config switching Three small demo/mock fixes: - Mocked entities dropped unit_of_measurement and state_class when writing to the state machine, so demo sensors rendered without a unit and the mocked history returned a single state for them - The energy consumption sensor entity id had a stray tab, which fails entity id validation in cards that render it - Switching demos saved the dashboard config before the new registries and entities reached the dashboard, so dashboard strategies generated against the previous data Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01KZ6ydA22VeQndgynH4SxCV * Add a home page demo to the demo Adds the home page as the second demo, generated by the real home dashboard strategies instead of a copy, so the demo shows what Home Assistant builds from a home: floors with their areas, area cards with temperature, and the summary views for lights, climate, security, media players, maintenance, weather and energy. The demo config provides the floors, areas and entities the strategies need, including the temperature and humidity sensors of each area, and a lock and a sprinkler as favorites. Switching demos is a tile in the favorites section, so the demo looks like a dashboard instead of carrying a card that no real home page would have. Its feature row has the button to move to the next demo. Demo navigation is fixed alongside it: navigate resolves paths like the browser does for pushState and keeps query parameters in the URL query instead of inside the hash, so panels can read them, and the route now follows popstate, which is the only event a traversal fires when the query changes too. --------- Co-authored-by: Claude <noreply@anthropic.com>	2026-07-26 17:41:30 +02:00
karwosts	39e70ff315	Show empty form errors (#53313 )	2026-07-26 15:19:22 +00:00
Paulus Schoutsen	14fd9114d6	Allow opening a specific demo via URL and document demo navigation for agents (#53281 ) * Allow opening a specific demo via URL and document demo navigation for agents Add a demo query parameter so a specific demo configuration can be opened directly, e.g. /?demo=arsaboo. Add demo/AGENTS.md documenting the demo URL scheme (demo selection and hash-based page routing), linked from the root agent guide. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V3oj5uaCRRaoXRd5iEffhi * Merge demo slugs into the demoConfigs registry Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V3oj5uaCRRaoXRd5iEffhi * Key demoConfigs by slug Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V3oj5uaCRRaoXRd5iEffhi * Add demos index of slugs and drop confProm temporary Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V3oj5uaCRRaoXRd5iEffhi * Track selected demo by slug instead of index Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V3oj5uaCRRaoXRd5iEffhi * Restore original setDemoConfig flow and drop slug lowercasing Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V3oj5uaCRRaoXRd5iEffhi --------- Co-authored-by: Claude <noreply@anthropic.com>	2026-07-26 17:15:10 +02:00
renovate[bot]	406a0b2bad	Update dependency lint-staged to v17.2.0 (#53312 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2026-07-26 16:26:33 +02:00
Paulus Schoutsen	4c86785d21	Fix mocked entity states and demo config switching (#53300 ) Three small demo/mock fixes: - Mocked entities dropped unit_of_measurement and state_class when writing to the state machine, so demo sensors rendered without a unit and the mocked history returned a single state for them - The energy consumption sensor entity id had a stray tab, which fails entity id validation in cards that render it - Switching demos saved the dashboard config before the new registries and entities reached the dashboard, so dashboard strategies generated against the previous data Claude-Session: https://claude.ai/code/session_01KZ6ydA22VeQndgynH4SxCV Co-authored-by: Claude <noreply@anthropic.com>	2026-07-26 16:25:37 +02:00
renovate[bot]	2aeb522eed	Update dependency color-name to v2.1.1 (#53297 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2026-07-26 09:18:43 +00:00
Paulus Schoutsen	bef1c0def6	Recompute sections view column count when the config changes (#53301 ) * Recompute sections view column count when the config changes The sections view element is reused when navigating between two sections views, so a view with a different max_columns kept the column count of the previous view until a resize made the ResizeObserver fire again. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01KZ6ydA22VeQndgynH4SxCV * Measure the host in the resize callback instead of the observer entries Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01KZ6ydA22VeQndgynH4SxCV * Clamp the column count to the config instead of caching it in the resize callback --------- Co-authored-by: Claude <noreply@anthropic.com>	2026-07-26 09:34:56 +03:00
dependabot[bot]	f7e5bdb2a0	Bump the codeql-action group across 1 directory with 2 updates (#53303 ) Bumps the codeql-action group with 2 updates in the / directory: [github/codeql-action/init](https://github.com/github/codeql-action) and [github/codeql-action/analyze](https://github.com/github/codeql-action). Updates `github/codeql-action/init` from 4.37.0 to 4.37.1 - [Release notes](https://github.com/github/codeql-action/releases) - [Changelog](https://github.com/github/codeql-action/blob/main/CHANGELOG.md) - [Commits](https://github.com/github/codeql-action/compare/99df26d4f13ea111d4ec1a7dddef6063f76b97e9...7188fc363630916deb702c7fdcf4e481b751f97a) Updates `github/codeql-action/analyze` from 4.37.0 to 4.37.1 - [Release notes](https://github.com/github/codeql-action/releases) - [Changelog](https://github.com/github/codeql-action/blob/main/CHANGELOG.md) - [Commits](https://github.com/github/codeql-action/compare/99df26d4f13ea111d4ec1a7dddef6063f76b97e9...7188fc363630916deb702c7fdcf4e481b751f97a) --- updated-dependencies: - dependency-name: github/codeql-action/init dependency-version: 4.37.1 dependency-type: direct:production update-type: version-update:semver-patch dependency-group: codeql-action - dependency-name: github/codeql-action/analyze dependency-version: 4.37.1 dependency-type: direct:production update-type: version-update:semver-patch dependency-group: codeql-action ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>	2026-07-26 09:29:35 +03:00
dependabot[bot]	de59237cfb	Bump home-assistant/actions/helpers/verify-version from f4ca6f671bd429efb108c0f2fa0ae8af0215986c to e3fb68ebda13d88a0d695082f471ba2c83d025fb (#53304 ) Bump home-assistant/actions/helpers/verify-version Bumps [home-assistant/actions/helpers/verify-version](https://github.com/home-assistant/actions) from f4ca6f671bd429efb108c0f2fa0ae8af0215986c to e3fb68ebda13d88a0d695082f471ba2c83d025fb. - [Release notes](https://github.com/home-assistant/actions/releases) - [Commits](https://github.com/home-assistant/actions/compare/f4ca6f671bd429efb108c0f2fa0ae8af0215986c...e3fb68ebda13d88a0d695082f471ba2c83d025fb) --- updated-dependencies: - dependency-name: home-assistant/actions/helpers/verify-version dependency-version: e3fb68ebda13d88a0d695082f471ba2c83d025fb dependency-type: direct:production ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>	2026-07-26 09:29:13 +03:00
dependabot[bot]	f778572b89	Bump release-drafter/release-drafter from 7.5.1 to 7.6.0 (#53305 ) Bumps [release-drafter/release-drafter](https://github.com/release-drafter/release-drafter) from 7.5.1 to 7.6.0. - [Release notes](https://github.com/release-drafter/release-drafter/releases) - [Commits](https://github.com/release-drafter/release-drafter/compare/4d75298e00d9e34c483e5ff8c68d0ea1c1940c1e...eada3c96a64734dd381cfbda23511034e328ddb0) --- updated-dependencies: - dependency-name: release-drafter/release-drafter dependency-version: 7.6.0 dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>	2026-07-26 09:28:55 +03:00
dependabot[bot]	d2c753b589	Bump actions/setup-python from 6.3.0 to 7.0.0 (#53306 ) Bumps [actions/setup-python](https://github.com/actions/setup-python) from 6.3.0 to 7.0.0. - [Release notes](https://github.com/actions/setup-python/releases) - [Commits](https://github.com/actions/setup-python/compare/ece7cb06caefa5fff74198d8649806c4678c61a1...5fda3b95a4ea91299a34e894583c3862153e4b97) --- updated-dependencies: - dependency-name: actions/setup-python dependency-version: 7.0.0 dependency-type: direct:production update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>	2026-07-26 09:28:35 +03:00
dependabot[bot]	8fbb38a25d	Bump pypa/gh-action-pypi-publish from 1.14.0 to 1.14.1 (#53307 ) Bumps [pypa/gh-action-pypi-publish](https://github.com/pypa/gh-action-pypi-publish) from 1.14.0 to 1.14.1. - [Release notes](https://github.com/pypa/gh-action-pypi-publish/releases) - [Commits](https://github.com/pypa/gh-action-pypi-publish/compare/cef221092ed1bacb1cc03d23a2d87d1d172e277b...ba38be9e461d3875417946c167d0b5f3d385a247) --- updated-dependencies: - dependency-name: pypa/gh-action-pypi-publish dependency-version: 1.14.1 dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>	2026-07-26 09:27:57 +03:00
dependabot[bot]	2f6c1388e8	Bump actions/checkout from 7.0.0 to 7.0.1 (#53308 ) Bumps [actions/checkout](https://github.com/actions/checkout) from 7.0.0 to 7.0.1. - [Release notes](https://github.com/actions/checkout/releases) - [Changelog](https://github.com/actions/checkout/blob/main/CHANGELOG.md) - [Commits](https://github.com/actions/checkout/compare/9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0...3d3c42e5aac5ba805825da76410c181273ba90b1) --- updated-dependencies: - dependency-name: actions/checkout dependency-version: 7.0.1 dependency-type: direct:production update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>	2026-07-26 09:27:39 +03:00
dependabot[bot]	ced5ffdd18	Bump actions/labeler from 6.2.0 to 7.0.0 (#53309 ) Bumps [actions/labeler](https://github.com/actions/labeler) from 6.2.0 to 7.0.0. - [Release notes](https://github.com/actions/labeler/releases) - [Commits](https://github.com/actions/labeler/compare/b8dd2d9be0f68b860e7dae5dae7d772984eacd6d...bf12e9b00b37c5c0ca2b87b79b2daf7891dbda13) --- updated-dependencies: - dependency-name: actions/labeler dependency-version: 7.0.0 dependency-type: direct:production update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>	2026-07-26 09:27:15 +03:00
Paulus Schoutsen	5a6a16ed27	Fix gallery type errors by letting registry mocks take the demo area and floor shapes (#53302 ) Let gallery mocks use the demo area and floor shapes The gallery passed full AreaRegistryEntry and FloorRegistryEntry objects to mockAreaRegistry and mockFloorRegistry. Those data parameters were dropped when the registries became demo-config-owned, which broke the gallery build. Instead of restoring the verbose registry-entry parameters, have the mocks accept the same DemoArea and DemoFloor shapes the demo configs use and seed the registry through setDemoAreas/setDemoFloors. The gallery fixtures now only spell out the fields they care about, matching how the other registry mocks take their initial data. Claude-Session: https://claude.ai/code/session_01PP4xVL8aDg5QAefLSmxY4C Co-authored-by: Claude <noreply@anthropic.com>	2026-07-25 18:15:30 -04:00
Aidan Timson	3d1ed43edc	Automatically activate frontend updates, support accessible toast actions, publish global dirty state (#53124 ) * Support accessible toast actions * Publish global dirty state changes * Automatically activate frontend updates * Add baseline tests for update dependencies * Cover update dependency behaviour * Render primary toast actions as filled * Test notification toast lifecycle * Document dirty state provider ownership * Publish dirty state from editor updates * Aggregate connected dirty state providers --------- Co-authored-by: Simon Lamon <32477463+silamon@users.noreply.github.com>	2026-07-25 11:18:34 +02:00
Paulus Schoutsen	d682830a3e	Register the hidden default dashboard panels in the demo (#53278 ) Register the light, climate, security and maintenance summary panels in the demo, hidden from the sidebar like the home panel. This makes them routable so strategy-generated dashboards can navigate to them. Claude-Session: https://claude.ai/code/session_01KZ6ydA22VeQndgynH4SxCV Co-authored-by: Claude <noreply@anthropic.com>	2026-07-25 11:15:05 +02:00
dependabot[bot]	863aad24fc	Bump js-yaml from 5.2.1 to 5.2.2 (#53292 ) Bumps [js-yaml](https://github.com/nodeca/js-yaml) from 5.2.1 to 5.2.2. - [Changelog](https://github.com/nodeca/js-yaml/blob/master/CHANGELOG.md) - [Commits](https://github.com/nodeca/js-yaml/compare/5.2.1...5.2.2) --- updated-dependencies: - dependency-name: js-yaml dependency-version: 5.2.2 dependency-type: direct:production ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>	2026-07-25 11:13:12 +02:00
Paulus Schoutsen	3284633ac9	Let demo configs provide areas and floors (#53280 ) Make areas and floors part of the individual demo config data instead of a single global registry: - DemoConfig gains optional floors and areas, applied on initial load and when switching demos, so each demo brings (and clears) its own registries - Areas can set a temperature and humidity entity - Mock entities can be assigned to an area via EntityInput.area_id, which flows into the mocked entity registry used by area filtering Claude-Session: https://claude.ai/code/session_01KZ6ydA22VeQndgynH4SxCV Co-authored-by: Claude <noreply@anthropic.com>	2026-07-25 11:03:27 +02:00
renovate[bot]	8dd54e0aa8	Update dependency lint-staged to v17.1.1 (#53290 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2026-07-25 11:01:06 +02:00
renovate[bot]	90a79d458f	Update dependency tar to v7.5.21 (#53287 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2026-07-25 11:01:04 +02:00
Joakim Plate	34dba7ea5a	Normalize number entity row input (#53284 ) hui-number-entity-row.ts bound the raw stateObj.state string to the non-slider ha-input, so a state like "50.0" showed decimals on the device page. state-card-number.ts (used by the more-info dialog) already normalizes via Number(state).toString(); apply the same here so both views render consistently.	2026-07-24 18:25:56 +02:00
renovate[bot]	e76e7d1064	Unpin dependency glob resolution (#53282 ) * Pin dependency glob to 10.5.0 * Apply suggestions from code review Co-authored-by: Simon Lamon <32477463+silamon@users.noreply.github.com> --------- Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Simon Lamon <32477463+silamon@users.noreply.github.com>	2026-07-24 15:39:16 +00:00
Paulus Schoutsen	b6675159ae	Mock the usage prediction command in the demo (#53279 ) Mock usage_prediction/common_control and load the usage_prediction component so common-controls sections in strategy dashboards render suggested entities in the demo. Entities that don't exist in the currently loaded demo config are filtered out by the section strategy. Claude-Session: https://claude.ai/code/session_01KZ6ydA22VeQndgynH4SxCV Co-authored-by: Claude <noreply@anthropic.com>	2026-07-24 17:20:29 +02:00
renovate[bot]	9d96d0b4aa	Update dependency @rspack/core to v2.1.5 (#53276 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2026-07-24 13:07:05 +00:00
Paulus Schoutsen	d900cc70c5	Fix unhandled error when the Cast SDK fails to load (#53271 ) * Fix unhandled error when the Cast SDK fails to load Resolve the Cast API as unavailable when the cast_sender.js script fails to load (offline, blocked by an ad-blocker or firewall), instead of leaking an unhandled promise rejection. Handle the resulting getCastManager rejection in the demo cast row, matching hui-cast-row, so the row hides itself. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V3oj5uaCRRaoXRd5iEffhi * Drop redundant comment Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V3oj5uaCRRaoXRd5iEffhi * Simplify promise memoization with ??= Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V3oj5uaCRRaoXRd5iEffhi * Revert "Simplify promise memoization with ??=" This reverts commit `5527741b6a`. --------- Co-authored-by: Claude <noreply@anthropic.com>	2026-07-24 13:01:46 +00:00
pcan08	837baff26c	Fix My Backups navigation (#53259 )	2026-07-24 14:57:41 +02:00
Petar Petrov	43b4e247af	Fix tile trend-graph feature not extending unchanging values to now (#53265 ) Extend tile trend-graph feature to current time for unchanged sensors	2026-07-24 12:52:06 +02:00
renovate[bot]	17def3c5ee	Update dependency prettier to v3.9.6 (#53267 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2026-07-24 12:46:59 +02:00
renovate[bot]	ba15879662	Update dependency @rsdoctor/rspack-plugin to v1.6.1 (#53266 ) Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>	2026-07-24 12:46:53 +02:00