Demote the unused state/numeric_state condition editors to base classes

With the automation condition editors handling state / numeric_state in
the dashboard editor, the lovelace `ha-card-condition-state` and
`ha-card-condition-numeric_state` elements are no longer rendered. Their
only remaining role is as the base class for the entity-filter
`-no_entity` variants, so drop the now-dead custom-element registrations
(and the redundant side-effect imports) while keeping the shared logic.

.agents/skills/ha-frontend-components/SKILL.md

@@ -1,99 +0,0 @@
----
-name: ha-frontend-components
-description: Home Assistant frontend component patterns. Use when implementing or reviewing dialogs, ha-form, ha-alert, keyboard shortcuts, tooltips, panels, Lovelace cards, or ha-button usage.
----
-
-# HA Frontend Components
-
-Use this skill when creating or reviewing Home Assistant UI components and common interaction patterns.
-
-## Dialogs
-
-Open dialogs through the fire-event pattern:
-
-```ts
-fireEvent(this, "show-dialog", {
-  dialogTag: "dialog-example",
-  dialogImport: () => import("./dialog-example"),
-  dialogParams: { title: "Example", data: someData },
-});
-```
-
-Dialog implementation requirements:
-
-- Use `ha-dialog`.
-- Use `DialogMixin`, which implements `HassDialogNext<T>`, for new dialogs. See `src/dialogs/dialog-mixin.ts`.
-- Existing dialogs may implement the legacy `HassDialog<T>` interface from `src/dialogs/make-dialog-manager.ts`.
-- Use `@state() private _open = false` to control visibility.
-- Set `_open = true` in `showDialog()` and `_open = false` in `closeDialog()`.
-- Return `nothing` while required params are absent.
-- Fire `dialog-closed` in the close handler.
-- Use `header-title` and `header-subtitle` for simple header text.
-- Use slots when standard header attributes are not enough.
-- Use `ha-dialog-footer` with `primaryAction` and `secondaryAction` slots.
-- Add `autofocus` to the first focusable element, such as `<ha-form autofocus>`, and forward it internally if needed.
-
-Use standard dialog widths: `small`, `medium`, `large`, or `full`. Avoid custom dialog sizing unless there is a clear product need.
-
-## Buttons
-
-`ha-button` wraps the Web Awesome button in `src/components/ha-button.ts`.
-
-Axes:
-
-- `variant`: `brand`, `neutral`, `danger`, `warning`, `success`.
-- `appearance`: `accent`, `filled`, `outlined`, `plain`.
-- `size`: `xs`, `s`, `m`, `l`, `xl`.
-
-Common usage:
-
-- Use `appearance="filled"` for primary emphasis when needed.
-- Use `appearance="plain"` for cancel and dismiss actions.
-- Use `variant="danger"` for destructive actions.
-- Place primary actions in `slot="primaryAction"` and secondary actions in `slot="secondaryAction"`.
-
-## Forms
-
-`ha-form` is schema-driven with `HaFormSchema[]` and supports common selectors for entities, devices, areas, targets, numbers, booleans, time, actions, text, objects, selects, icons, media, and location.
-
-Use `computeLabel`, `computeError`, and `computeHelper` for translated labels, validation, and helper text.
-
-```ts
-<ha-form
-  .hass=${this.hass}
-  .data=${this._data}
-  .schema=${this._schema}
-  .error=${this._errors}
-  .computeLabel=${(schema) => this.hass.localize(`ui.panel.${schema.name}`)}
-  @value-changed=${this._valueChanged}
-></ha-form>
-```
-
-## Alerts
-
-Use `ha-alert` for user-visible status messaging.
-
-- Alert types: `error`, `warning`, `info`, `success`.
-- Useful properties: `title`, `alert-type`, `dismissable`, `narrow`.
-- Slots: `icon` for custom leading icon, `action` for custom action content.
-- Content is announced by screen readers when dynamically displayed.
-
-```html
-<ha-alert alert-type="error">Error message</ha-alert>
-<ha-alert alert-type="warning" title="Warning">Description</ha-alert>
-<ha-alert alert-type="success" dismissable>Success message</ha-alert>
-```
-
-## Shortcuts And Tooltips
-
-Use `ShortcutManager` from `src/common/keyboard/shortcuts.ts` for keyboard shortcuts. It blocks shortcuts in input fields, can prevent shortcuts during text selection, and supports character and KeyCode shortcuts for non-latin keyboards. See `src/state/quick-bar-mixin.ts` for global shortcut examples.
-
-Use `ha-tooltip` from `src/components/ha-tooltip.ts` for contextual hover help. See `src/components/ha-label.ts` for an example.
-
-## Panels And Lovelace Cards
-
-Panels commonly extend `SubscribeMixin(LitElement)` and receive route and narrow-layout properties.
-
-Lovelace cards should implement `LovelaceCard`, validate config in `setConfig()`, handle loading, error, unavailable, and missing-entity states, and add a configuration editor when needed.
-
-Cards are user-story surfaces. Support different households, entity types, responsive layouts, and accessible interaction states.

.agents/skills/ha-frontend-contexts/SKILL.md

@@ -1,78 +0,0 @@
----
-name: ha-frontend-contexts
-description: Home Assistant frontend Lit context and hass migration guidance. Use when adding or changing component state access, replacing hass reads, consuming entity or registry contexts, or reviewing rerender behavior.
----
-
-# HA Frontend Contexts
-
-Use this skill when a component reads Home Assistant state, registries, localization, services, config, UI data, connection state, or API helpers.
-
-## Goal
-
-Move leaf components away from the broad `hass: HomeAssistant` object. Broad `hass` access rerenders components for unrelated changes, hides the data a component depends on, and makes tests harder to mock.
-
-Container components may keep `hass` when they own it and feed providers. Leaf components should consume the narrowest context that covers their reads.
-
-## Core Files
-
-- Context definitions: `src/data/context/index.ts`
-- Entity-scoped consume helpers: `src/common/decorators/consume-context-entry.ts`
-- Transform decorator: `src/common/decorators/transform.ts`
-- Canonical migration example: `src/panels/lovelace/cards/hui-button-card.ts`
-- Providers are wired by `contextMixin` on `HassBaseEl`; consumers do not wire providers manually.
-
-## Context Selection
-
-| Context                                                              | Replaces                                                                               |
-| -------------------------------------------------------------------- | -------------------------------------------------------------------------------------- |
-| `statesContext`                                                      | `hass.states`                                                                          |
-| `entitiesContext`, `devicesContext`, `areasContext`, `floorsContext` | `hass.entities`, `hass.devices`, `hass.areas`, `hass.floors`                           |
-| `registriesContext`                                                  | all four registries together                                                           |
-| `servicesContext`                                                    | `hass.services`                                                                        |
-| `internationalizationContext`                                        | `hass.localize`, `hass.locale`, `hass.language`                                        |
-| `formattersContext`                                                  | entity and attribute formatters                                                        |
-| `configContext`                                                      | `hass.config`, `hass.user`, `hass.auth`, `hass.userData`                               |
-| `connectionContext`                                                  | `hass.connection`, `hass.connected`, `hass.hassUrl`                                    |
-| `apiContext`                                                         | `hass.callService`, `hass.callApi`, `hass.callWS`, `hass.sendWS`, `hass.fetchWithAuth` |
-| `uiContext`                                                          | themes, selected theme, panels, sidebar, and UI state                                  |
-| `narrowViewportContext`                                              | narrow-layout boolean                                                                  |
-
-Lazy contexts subscribe on first consumer and tear down after the last consumer: `labelsContext`, `fullEntitiesContext`, `configEntriesContext`, and `manifestsContext`.
-
-The single-field contexts such as `localizeContext`, `themesContext`, and `userContext` are deprecated. Use grouped contexts instead.
-
-## Consumption Patterns
-
-Use entity-scoped helpers when the component watches an entity id held on the host:
-
-```ts
-@state() @consumeEntityState({ entityIdPath: ["_config", "entity"] })
-private _stateObj?: HassEntity;
-
-@state() @consumeEntityRegistryEntry({ entityIdPath: ["_config", "entity"] })
-private _entity?: EntityRegistryDisplayEntry;
-
-@state() @consumeLocalize()
-private _localize!: LocalizeFunc;
-```
-
-For a single field from a grouped context, pair `@consume` with `@transform`:
-
-```ts
-@state()
-@consume({ context: uiContext, subscribe: true })
-@transform<HomeAssistantUI, Themes>({ transformer: ({ themes }) => themes })
-private _themes!: Themes;
-```
-
-Use `@transform` with `watch` when the transformer depends on a host property, such as a computed entity id. `consumeEntityState` only watches the first path segment.
-
-To consume a whole group untransformed, omit `@transform` and type the field as `ContextType<typeof statesContext>` or the matching context type.
-
-## Review Checklist
-
-- The component consumes the narrowest context needed for the data it reads.
-- A broad `hass` property is kept only when the component is a container or external API requires it.
-- Entity-scoped reads use the consume helpers rather than ad hoc context transforms.
-- Context fields are marked `@state()` so updates trigger rendering.
-- Tests and mocks only provide the data the component actually consumes.

.agents/skills/ha-frontend-review/SKILL.md

@@ -1,73 +0,0 @@
----
-name: ha-frontend-review
-description: Home Assistant frontend PR and review guidance. Use when reviewing frontend changes, preparing a PR, checking recurring review issues, or applying the PR template.
----
-
-# HA Frontend Review
-
-Use this skill when reviewing Home Assistant frontend changes or preparing a pull request.
-
-## Pull Request Body
-
-When creating a pull request, use `.github/PULL_REQUEST_TEMPLATE.md` as the body.
-
-- Do not omit, reorder, or rewrite template sections.
-- Check the appropriate "Type of change" box based on the actual change.
-- Do not check checklist items on behalf of the user.
-- If the PR includes UI changes, remind the user to add screenshots or a short video.
-- Explain what the change does for users, not only implementation details.
-- Use Markdown.
-
-## Pre-Submission Checklist
-
-- `yarn lint` passes when practical for the scope.
-- `yarn test` or focused relevant tests are green when practical for the scope.
-- Tests are added or updated for new data processing and utilities where applicable.
-- User-facing text is localized and follows `ha-frontend-user-facing-text` guidance.
-- Components handle loading, error, unavailable, and missing-entity states.
-- Entity existence is checked before property access.
-- Event listeners and subscriptions are cleaned up.
-- UI is accessible to screen readers and keyboard users.
-
-## Recurring Review Issues
-
-User experience and accessibility:
-
-- Forms need proper labels, helper text, and validation feedback.
-- Form markup should not cause password managers to identify fields incorrectly.
-- Clickable areas should be large enough for touch interaction.
-- Hover, active, disabled, loading, and focus states should be clear.
-
-Dialog and modal patterns:
-
-- Multi-step operations should show progress.
-- Dialog state should survive background operations correctly.
-- Cancel and close buttons should behave consistently.
-- Defaults should be helpful without blocking user override.
-
-Component design patterns:
-
-- Terminology should be consistent. Use words like "Join" or "Apply" instead of "Group" when that better matches the user action.
-- Visual hierarchy should use appropriate font sizes, weights, and spacing ratios.
-- Components should align to the design grid.
-- Badges and indicators should be placed consistently.
-
-Code quality:
-
-- Null and undefined paths should be handled explicitly.
-- Potentially undefined array and object access should be guarded.
-- Event handlers, timers, observers, and subscriptions should be cleaned up.
-
-Configuration and props:
-
-- Make configuration fields optional when sensible.
-- Provide reasonable defaults.
-- Keep APIs extensible without adding speculative abstractions.
-- Validate configuration before applying changes.
-
-## Review Flow
-
-- Identify behavioral regressions, bugs, accessibility issues, and missing tests first.
-- Keep style-only comments secondary unless they affect maintainability or user experience.
-- Prefer small, direct fixes over large refactors during review follow-up.
-- Cross-load `ha-frontend-contexts`, `ha-frontend-components`, `ha-frontend-styling`, `ha-frontend-testing`, or `ha-frontend-user-facing-text` when a finding falls in that area.

.agents/skills/ha-frontend-styling/SKILL.md

@@ -1,78 +0,0 @@
----
-name: ha-frontend-styling
-description: Home Assistant frontend styling, theming, spacing, responsive layout, RTL, and View Transitions guidance. Use when editing CSS, layout, motion, or visual component structure.
----
-
-# HA Frontend Styling
-
-Use this skill when editing CSS, layout, visual hierarchy, theme integration, responsive behavior, RTL support, or view transitions.
-
-## Theme And Layout Basics
-
-- Use Home Assistant CSS custom properties instead of hardcoded colors.
-- Use `--ha-space-*` spacing tokens instead of hardcoded spacing where possible.
-- Keep components mobile-first and enhance for desktop.
-- Keep layouts RTL-safe. Prefer logical properties when they fit.
-- Prefer `ha-*` components and current Web Awesome wrappers.
-- Avoid adding new legacy Material Web Components (`mwc-*`).
-- Scope styles to the component. Do not rely on global styles for component internals.
-
-Spacing tokens are defined in `src/resources/theme/core.globals.ts`. The scale runs from `--ha-space-1` at 4px through `--ha-space-20` at 80px in 4px increments. Common values are `--ha-space-2` at 8px, `--ha-space-4` at 16px, and `--ha-space-8` at 32px.
-
-```ts
-static get styles() {
-  return css`
-    :host {
-      padding: var(--ha-space-4);
-      color: var(--primary-text-color);
-      background-color: var(--card-background-color);
-    }
-
-    .content {
-      gap: var(--ha-space-2);
-    }
-
-    @media (max-width: 600px) {
-      :host {
-        padding: var(--ha-space-2);
-      }
-    }
-  `;
-}
-```
-
-## Interaction States
-
-- Make touch targets large enough for mobile.
-- Provide clear hover, active, focus, disabled, loading, error, and unavailable states.
-- Preserve keyboard navigation and visible focus indicators.
-- Maintain WCAG AA contrast for text and essential UI affordances.
-
-## View Transitions
-
-Use the View Transitions API only for meaningful continuity between DOM states.
-
-Core resources:
-
-- Utility wrapper: `src/common/util/view-transition.ts`, `withViewTransition()`.
-- Launch-screen fade example: `src/util/launch-screen.ts`.
-- Animation keyframes: `src/resources/theme/animations.globals.ts`.
-- Animation duration tokens: `src/resources/theme/core.globals.ts`.
-
-Implementation rules:
-
-- Use `withViewTransition()` for fallback behavior.
-- Keep transitions simple. Subtle fades and crossfades usually work best.
-- Use `--ha-animation-duration-fast`, `--ha-animation-duration-normal`, or `--ha-animation-duration-slow` for timing.
-- Ensure each `view-transition-name` is unique at any given time.
-- Remember only one view transition can run at a time.
-- View transitions operate at document level and do not work inside Shadow DOM style isolation. For web components, set `view-transition-name` on `:host` or use document-level transitions.
-- The root gets `view-transition-name: root` by default. Target `::view-transition-group(root)` to customize the default page transition.
-
-## Review Checklist
-
-- Styling uses theme variables and spacing tokens where practical.
-- Layout is mobile-first and RTL-safe.
-- Component styles are scoped.
-- Interactive states are clear and accessible.
-- Motion is subtle, tokenized, and respects reduced-motion behavior through existing globals.

.agents/skills/ha-frontend-testing/SKILL.md

@@ -1,78 +0,0 @@
----
-name: ha-frontend-testing
-description: Home Assistant frontend testing and validation workflow. Use when adding or updating tests, running lint, TypeScript checks, Vitest, Playwright e2e suites, dev servers, or chart-data benchmarks.
----
-
-# HA Frontend Testing
-
-Use this skill when choosing or running validation for frontend changes.
-
-## Test Helpers
-
-- Before adding or changing tests, inspect the relevant suite's existing helpers and fixtures. Reuse them instead of duplicating setup, test data, navigation, interactions, waits, or assertions.
-- When the same test flow appears more than once, move it into the closest suite-local helper with a focused interface.
-- Keep one-off test behaviour in the test unless a helper makes the intent materially clearer. Do not hide the behaviour under test behind broad, configurable abstractions.
-
-## Core Commands
-
-```bash
-yarn lint          # ESLint + Prettier + TypeScript + Lit
-yarn format        # Auto-fix ESLint + Prettier
-yarn lint:types    # TypeScript compiler, run without file arguments
-yarn test          # Vitest
-yarn dev           # App dev server
-yarn dev:serve     # Local serving dev server
-```
-
-Never run `tsc` or `yarn lint:types` with file arguments. File arguments make `tsc` ignore `tsconfig.json` and can emit `.js` files into `src/`.
-
-For focused type feedback on one file, use editor diagnostics instead of a file-scoped `tsc` command.
-
-## Unit And Utility Tests
-
-- Add or update Vitest tests for data processing, utility code, and behavior that can be tested without a browser.
-- Mock WebSocket connections and API calls at boundaries.
-- Cover loading, error, unavailable, and missing-entity states where relevant.
-- Test accessibility-sensitive behavior when it can be asserted without brittle DOM internals.
-
-## Dev Servers
-
-`yarn dev` builds and watches the app, served by a running Home Assistant core configured through `development_repo`.
-
-`yarn dev:serve` also serves locally and supports `-c` for the core URL and `-p` for the port. The default is 8124, or 8123 in a devcontainer.
-
-Dev server commands support `--background`, `--status`, `--stop`, and `--logs [--follow]`. Prefer managed background mode while iterating so the watcher stays available across test runs without occupying the terminal.
-
-## Playwright E2E
-
-Each suite has its own dev server port. Playwright reuses an existing server locally when its configured URL responds; otherwise it performs a slow full build. When a development watcher is being reused, rspack recompiles on save and reruns should not need a restart.
-
-Start the relevant suite server, then run that suite:
-
-| Suite   | Background server                            | Test command            |
-| ------- | -------------------------------------------- | ----------------------- |
-| App     | `yarn test:e2e:app:dev --background` on 8095 | `yarn test:e2e:app`     |
-| Demo    | `yarn dev:demo --background` on 8090         | `yarn test:e2e:demo`    |
-| Gallery | `yarn dev:gallery --background` on 8100      | `yarn test:e2e:gallery` |
-
-The custom development wrappers use `/__ha_dev_status` to identify and manage their own suites. Playwright server reuse checks the configured URL instead. Wrapper start and stop operations are idempotent for a matching suite and reject an unrelated process occupying the port.
-
-Local runs against a watched development server do not always match CI's clean build artifacts, environment, sharding, or worker configuration. Use background servers for the fast iteration loop, but confirm the relevant CI jobs complete successfully before considering E2E changes verified.
-
-Use `-g "<title>" --project=chromium` to narrow a run. `yarn test:e2e` runs all three suites in parallel when every managed server is available, otherwise it runs them sequentially to prevent cold builds racing over shared generated assets. Run suites directly; piping through output truncation hides progress and failures.
-
-The app suite uses a stripped-down harness for e2e. Demo and gallery use their normal dev servers.
-
-## Benchmarks
-
-For chart data transforms such as history, statistics, energy, and downsampling, follow `test/benchmarks/README.md`.
-
-Use seeded fixtures, characterization snapshot tests, and `yarn test:bench` before and after optimization. Optimizations must keep output bit-identical.
-
-## Verification Selection
-
-- Documentation-only change: no code test required unless examples or commands changed.
-- Type-only or utility change: run focused Vitest if available, then `yarn lint:types` if practical.
-- Lit component change: run relevant tests plus lint or typecheck depending on scope.
-- E2E-sensitive flow: start the relevant e2e dev server and run the narrow Playwright suite.
-- Broad refactor: run `yarn lint` and relevant test suites when practical.

.agents/skills/ha-frontend-user-facing-text/SKILL.md

@@ -1,98 +0,0 @@
----
-name: ha-frontend-user-facing-text
-description: Home Assistant frontend copy, localization, terminology, and user-facing text guidance. Use when adding or reviewing labels, buttons, dialogs, errors, translations, or UI strings.
----
-
-# HA Frontend User-Facing Text
-
-Use this skill for all user-facing text, translations, labels, buttons, dialog copy, errors, helper text, and review comments about wording.
-
-## Localization
-
-- All user-facing text must be translatable.
-- Add translation keys to `src/translations/en.json` when introducing new strings.
-- Use the localization system instead of inline user-visible strings.
-- Prefer complete localized strings with placeholders over concatenating translated fragments.
-- Give translators enough context through key naming and placeholders.
-
-```ts
-this.hass.localize("ui.panel.config.updates.updates_refreshed", {
-  count: 5,
-});
-```
-
-## Voice And Style
-
-- Use American English.
-- Use a friendly, informational tone.
-- Address users directly with "you" and "your" when appropriate.
-- Be inclusive, objective, and non-discriminatory.
-- Be concise and clear.
-- Use active voice.
-- Avoid jargon where a familiar home automation term works.
-- Always write "Home Assistant" in full. Do not use "HA" or "HASS" in user-facing copy.
-- Spell out terms when possible.
-- Use sentence case for titles, headings, buttons, labels, and UI elements.
-- Use the Oxford comma in lists.
-- Prefer "like" over "e.g." and "for example" over "i.e.".
-- Avoid all caps for emphasis. Use wording, bold, or italics instead.
-- Write for both technical and non-technical users.
-
-Sentence case examples:
-
-- Use: "Create new automation"
-- Avoid: "Create New Automation"
-- Use: "Device settings"
-- Avoid: "Device Settings"
-
-## Terminology
-
-Use "integration" instead of "component" for user-facing product language unless referring to a frontend component in developer context.
-
-Technical product terms are lowercase in prose: automation, entity, device, service.
-
-## Delete, Remove, Create, Add
-
-Use "Remove" for actions that can be restored or reapplied:
-
-- Removing a user's permission.
-- Removing a user from a group.
-- Removing links between items.
-- Removing a widget from a dashboard.
-- Removing an item from a cart.
-
-Use "Delete" for permanent, non-recoverable actions:
-
-- Deleting a field.
-- Deleting a value in a field.
-- Deleting a task.
-- Deleting a group.
-- Deleting a permission.
-- Deleting a calendar event.
-
-Use "Add" for already-existing items:
-
-- Adding a permission to a user.
-- Adding a user to a group.
-- Adding links between items.
-- Adding a widget to a dashboard.
-- Adding an item to a cart.
-
-Use "Create" for something made from scratch:
-
-- Creating a new field.
-- Creating a new task.
-- Creating a new group.
-- Creating a new permission.
-- Creating a new calendar event.
-
-Create pairs with Delete. Add pairs with Remove.
-
-## Review Checklist
-
-- Text is localized.
-- Copy uses sentence case.
-- "Home Assistant" is written in full.
-- Delete/Remove and Create/Add match recoverability and object lifecycle.
-- Placeholders are used instead of string concatenation.
-- The wording is concise and understandable without implementation knowledge.

.claude/skills

@@ -1 +0,0 @@
-../.agents/skills

.github/ISSUE_TEMPLATE.md

@@ -67,7 +67,7 @@ DO NOT DELETE ANY TEXT from this template! Otherwise, your issue may be closed w
 <!--
   If your issue is about how an entity is shown in the UI, please add the state
   and attributes for all situations with a screenshot of the UI.
-  You can find this information at `/config/tools/state`
+  You can find this information at `/config/developer-tools/state`
 -->
 
 ```yaml

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -94,8 +94,8 @@ body:
       label: State of relevant entities
       description: >
         If your issue is about how an entity is shown in the UI, please add the
-        state and attributes for all situations. You can find this
-        information in the Details view of the More info dialog.
+        state and attributes for all situations. You can find this information
+        at Developer Tools -> States.
       render: txt
   - type: textarea
     attributes:

.github/actions/build/action.yml

@@ -1,23 +0,0 @@
-name: Build frontend target
-description: Run a gulp build target
-
-inputs:
-  target:
-    description: gulp target to run
-    required: true
-  github-token:
-    description: GitHub token for fetching nightly translations; omit to build English-only
-    default: ""
-  is-test:
-    description: Set IS_TEST for the build (skips source maps and compression)
-    default: "false"
-
-runs:
-  using: composite
-  steps:
-    - name: Build ${{ inputs.target }}
-      shell: bash
-      run: ./node_modules/.bin/gulp ${{ inputs.target }}
-      env:
-        GITHUB_TOKEN: ${{ inputs.github-token }}
-        IS_TEST: ${{ inputs.is-test }}

.github/actions/netlify-deploy/action.yml

@@ -1,52 +0,0 @@
-name: Deploy to Netlify
-description: Deploy a directory to Netlify (production when alias is empty, otherwise to the alias)
-
-inputs:
-  dir:
-    description: Directory to deploy
-    required: true
-  alias:
-    description: Deploy alias; leave empty to deploy to production
-    default: ""
-  auth-token:
-    description: NETLIFY_AUTH_TOKEN
-    required: true
-  site-id:
-    description: NETLIFY_SITE_ID
-    required: true
-
-outputs:
-  netlify_url:
-    description: The deployed URL
-    value: ${{ steps.deploy.outputs.netlify_url }}
-  unique_deploy_url:
-    description: The unique hash-based deployment URL for this specific build
-    value: ${{ steps.deploy.outputs.unique_deploy_url }}
-
-runs:
-  using: composite
-  steps:
-    - name: Deploy to Netlify
-      id: deploy
-      shell: bash
-      env:
-        DIR: ${{ inputs.dir }}
-        ALIAS: ${{ inputs.alias }}
-        NETLIFY_AUTH_TOKEN: ${{ inputs.auth-token }}
-        NETLIFY_SITE_ID: ${{ inputs.site-id }}
-      run: |
-        # Execute the deployment
-        if [ -n "$ALIAS" ]; then
-          npx -y netlify-cli deploy --dir="$DIR" --alias "$ALIAS" --json > deploy_output.json
-        else
-          npx -y netlify-cli deploy --dir="$DIR" --prod --json > deploy_output.json
-        fi
-
-        # Collect the urls from the deployment output
-        NETLIFY_URL=$(jq -r '.url // .deploy_url' deploy_output.json)
-        SITE_NAME=$(jq -r '.site_name' deploy_output.json)
-        DEPLOY_ID=$(jq -r '.deploy_id' deploy_output.json)
-        UNIQUE_URL="https://${DEPLOY_ID}--${SITE_NAME}.netlify.app"
-
-        echo "netlify_url=$NETLIFY_URL" >> "$GITHUB_OUTPUT"
-        echo "unique_deploy_url=$UNIQUE_URL" >> "$GITHUB_OUTPUT"

.github/actions/prepare-dependencies/action.yml

@@ -1,41 +0,0 @@
-name: Prepare dependencies
-description: Install and cache the complete dependency tree
-
-inputs:
-  node-modules-cache-key:
-    description: Prefix for the shared node_modules cache key
-    default: node-modules-v1
-
-runs:
-  using: composite
-  steps:
-    - name: Check for complete dependency tree
-      id: dependencies
-      continue-on-error: true
-      uses: actions/cache/restore@55cc8345863c7cc4c66a329aec7e433d2d1c52a9 # v6.1.0
-      with:
-        path: |
-          node_modules
-          .yarn/install-state.gz
-        key: >-
-          ${{ inputs.node-modules-cache-key }}-${{ runner.os }}-${{ runner.arch }}-${{
-          hashFiles('.nvmrc', 'package.json', 'yarn.lock', '.yarnrc.yml', '.yarn/releases/**', '.yarn/patches/**') }}
-        lookup-only: true
-
-    - name: Setup Node and install
-      if: steps.dependencies.outputs.cache-hit != 'true'
-      uses: ./.github/actions/setup
-      with:
-        cache: false
-
-    - name: Save complete dependency tree
-      if: steps.dependencies.outputs.cache-hit != 'true'
-      continue-on-error: true
-      uses: actions/cache/save@55cc8345863c7cc4c66a329aec7e433d2d1c52a9 # v6.1.0
-      with:
-        path: |
-          node_modules
-          .yarn/install-state.gz
-        key: >-
-          ${{ inputs.node-modules-cache-key }}-${{ runner.os }}-${{ runner.arch }}-${{
-          hashFiles('.nvmrc', 'package.json', 'yarn.lock', '.yarnrc.yml', '.yarn/releases/**', '.yarn/patches/**') }}

.github/actions/setup/action.yml

@@ -1,47 +0,0 @@
-name: Setup Node and install
-description: Set up Node from .nvmrc and install yarn dependencies
-
-inputs:
-  immutable:
-    description: Pass --immutable to yarn install
-    default: "true"
-  cache:
-    description: Enable the yarn cache in setup-node
-    default: "true"
-  node-modules-cache:
-    description: Restore the exact shared node_modules cache before installing
-    default: "false"
-  node-modules-cache-key:
-    description: Prefix for the shared node_modules cache key
-    default: node-modules-v1
-
-runs:
-  using: composite
-  steps:
-    - name: Restore complete dependency tree
-      id: dependency-cache
-      if: inputs.node-modules-cache == 'true'
-      continue-on-error: true
-      uses: actions/cache/restore@55cc8345863c7cc4c66a329aec7e433d2d1c52a9 # v6.1.0
-      with:
-        path: |
-          node_modules
-          .yarn/install-state.gz
-        key: >-
-          ${{ inputs.node-modules-cache-key }}-${{ runner.os }}-${{ runner.arch }}-${{
-          hashFiles('.nvmrc', 'package.json', 'yarn.lock', '.yarnrc.yml', '.yarn/releases/**', '.yarn/patches/**') }}
-
-    - name: Setup Node
-      uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
-      with:
-        node-version-file: ".nvmrc"
-        cache: ${{ inputs.cache == 'true' && (inputs.node-modules-cache != 'true' || steps.dependency-cache.outputs.cache-hit != 'true') && 'yarn' || '' }}
-
-    - name: Enable Corepack
-      shell: bash
-      run: corepack enable
-
-    - name: Install dependencies
-      if: inputs.node-modules-cache != 'true' || steps.dependency-cache.outputs.cache-hit != 'true'
-      shell: bash
-      run: yarn install ${{ inputs.immutable == 'true' && '--immutable' || '' }}

.github/copilot-instructions.md

@@ -1 +0,0 @@
-../AGENTS.md

.github/copilot-instructions.md

@@ -0,0 +1,648 @@
+# GitHub Copilot & Claude Code Instructions
+
+You are an assistant helping with development of the Home Assistant frontend. The frontend is built using Lit-based Web Components and TypeScript, providing a responsive and performant interface for home automation control.
+
+**Note**: This file contains high-level guidelines and references to implementation patterns. For gallery-specific documentation, demos, page structure, and usage examples, see [`gallery/AGENTS.md`](gallery/AGENTS.md).
+
+## Table of Contents
+
+- [Quick Reference](#quick-reference)
+- [Core Architecture](#core-architecture)
+- [State Access: Contexts Instead of `hass`](#state-access-contexts-instead-of-hass)
+- [Development Standards](#development-standards)
+- [Component Library](#component-library)
+- [Common Patterns](#common-patterns)
+- [Text and Copy Guidelines](#text-and-copy-guidelines)
+- [Development Workflow](#development-workflow)
+- [Review Guidelines](#review-guidelines)
+
+## Quick Reference
+
+### Essential Commands
+
+```bash
+yarn lint          # ESLint + Prettier + TypeScript + Lit
+yarn format        # Auto-fix ESLint + Prettier
+yarn lint:types    # TypeScript compiler (run WITHOUT file arguments)
+yarn test          # Vitest
+script/develop     # Development server
+```
+
+> **WARNING:** Never run `tsc` or `yarn lint:types` with file arguments (e.g., `yarn lint:types src/file.ts`). When `tsc` receives file arguments, it ignores `tsconfig.json` and emits `.js` files into `src/`, polluting the codebase. Always run `yarn lint:types` without arguments. For individual file type checking, rely on IDE diagnostics. If `.js` files are accidentally generated, clean up with `git clean -fd src/`.
+
+### Component Prefixes
+
+- `ha-` - Home Assistant components
+- `hui-` - Lovelace UI components
+- `dialog-` - Dialog components
+
+### Import Patterns
+
+```typescript
+import type { HomeAssistant } from "../types";
+import { fireEvent } from "../common/dom/fire_event";
+import { showAlertDialog } from "../dialogs/generic/show-dialog-box";
+```
+
+## Core Architecture
+
+The Home Assistant frontend is a modern web application that:
+
+- Uses Web Components (custom elements) built with Lit framework
+- Is written entirely in TypeScript with strict type checking
+- Communicates with the backend via WebSocket API
+- Provides comprehensive theming and internationalization
+
+## State Access: Contexts Instead of `hass`
+
+Every component used to take the whole `hass: HomeAssistant` object — a god-object that re-renders on any unrelated `hass` change, forces tests to mock everything, and hides what a component actually reads. We're moving leaf components to **fine-grained [Lit context](https://lit.dev/docs/data/context/)**: consume only the slice you need and re-render only when it changes.
+
+For new code, consume the matching context instead of adding a `hass` property. `hass` stays for container components that own it and feed the providers; the canonical migration is [`hui-button-card.ts`](src/panels/lovelace/cards/hui-button-card.ts). Infrastructure: contexts in [`src/data/context/index.ts`](src/data/context/index.ts), the `consume…` helpers in [`src/common/decorators/consume-context-entry.ts`](src/common/decorators/consume-context-entry.ts), and `@transform` in [`src/common/decorators/transform.ts`](src/common/decorators/transform.ts). Providers are wired automatically by `contextMixin` on `HassBaseEl` — you only consume.
+
+### Contexts
+
+Consume the narrowest context that covers your reads:
+
+| Context                                                                 | Replaces                                                                                  |
+| ----------------------------------------------------------------------- | ----------------------------------------------------------------------------------------- |
+| `statesContext`                                                         | `hass.states`                                                                             |
+| `entitiesContext` / `devicesContext` / `areasContext` / `floorsContext` | `hass.entities` / `.devices` / `.areas` / `.floors` (or `registriesContext` for all four) |
+| `servicesContext`                                                       | `hass.services`                                                                           |
+| `internationalizationContext`                                           | `hass.localize`, `hass.locale`, `hass.language`                                           |
+| `formattersContext`                                                     | `hass.formatEntityName`, `hass.formatEntityState`, `hass.formatEntityAttributeName`, …    |
+| `configContext`                                                         | `hass.config`, `hass.user`, `hass.auth`, `hass.userData`                                  |
+| `connectionContext`                                                     | `hass.connection`, `hass.connected`, `hass.hassUrl`                                       |
+| `apiContext`                                                            | `hass.callService`, `hass.callApi`, `hass.callWS`, `hass.sendWS`, `hass.fetchWithAuth`    |
+| `uiContext`                                                             | `hass.themes`, `hass.selectedTheme`, `hass.panels`, `hass.dockedSidebar`, …               |
+| `narrowViewportContext`                                                 | narrow-layout boolean                                                                     |
+
+Lazy contexts (subscribe on first consumer, tear down after the last): `labelsContext`, `fullEntitiesContext`, `configEntriesContext`, `manifestsContext`. The single-field contexts (`localizeContext`, `themesContext`, `userContext`, …) are **deprecated** — use the grouped ones above.
+
+### Consuming
+
+Use the `consume…` helpers for entity-scoped and `localize` reads. `entityIdPath` is resolved against `this`, so these watch `this._config.entity`:
+
+```ts
+@state() @consumeEntityState({ entityIdPath: ["_config", "entity"] })
+private _stateObj?: HassEntity; // consumeEntityStates(...) for a record of several
+
+@state() @consumeEntityRegistryEntry({ entityIdPath: ["_config", "entity"] })
+private _entity?: EntityRegistryDisplayEntry;
+
+@state() @consumeLocalize()
+private _localize!: LocalizeFunc;
+```
+
+For any other single field, pair `@consume` with `@transform`:
+
+```ts
+@state()
+@consume({ context: uiContext, subscribe: true })
+@transform<HomeAssistantUI, Themes>({ transformer: ({ themes }) => themes })
+private _themes!: Themes;
+```
+
+`@transform`'s `watch` option re-runs the transformer when a host prop changes — needed when an entity id is computed, since `consumeEntityState` only watches the first path segment. To consume a whole group untransformed, drop `@transform` and type it `ContextType<typeof statesContext>`.
+
+## Development Standards
+
+### Code Quality Requirements
+
+**Linting and Formatting (Enforced by Tools)**
+
+- ESLint config (flat config) extends TypeScript strict, Lit, Web Components, Accessibility (lit-a11y), and import-x
+- Prettier with ES5 trailing commas enforced
+- No console statements (`no-console: "error"`) - use proper logging
+- Import organization: No unused imports, consistent type imports
+
+**Naming Conventions**
+
+- PascalCase for types and classes
+- camelCase for variables, methods
+- Private methods require leading underscore
+- Public methods forbid leading underscore
+
+### TypeScript Usage
+
+- **Always use strict TypeScript**: Enable all strict flags, avoid `any` types
+- **Proper type imports**: Use `import type` for type-only imports
+- **Define interfaces**: Create proper interfaces for data structures
+- **Type component properties**: All Lit properties must be properly typed
+- **No unused variables**: Prefix with `_` if intentionally unused
+- **Consistent imports**: Use `@typescript-eslint/consistent-type-imports`
+
+```typescript
+// Good
+import type { HomeAssistant } from "../types";
+
+interface EntityConfig {
+  entity: string;
+  name?: string;
+}
+
+@property({ type: Object })
+hass!: HomeAssistant;
+
+// Bad
+@property()
+hass: any;
+```
+
+### Web Components with Lit
+
+- **Use Lit 3.x patterns**: Follow modern Lit practices
+- **Extend appropriate base classes**: Use `LitElement`, `SubscribeMixin`, or other mixins as needed
+- **Define custom element names**: Use `ha-` prefix for components
+
+```typescript
+@customElement("ha-my-component")
+export class HaMyComponent extends LitElement {
+  @property({ attribute: false })
+  hass!: HomeAssistant;
+
+  @state()
+  private _config?: MyComponentConfig;
+
+  static get styles() {
+    return css`
+      :host {
+        display: block;
+      }
+    `;
+  }
+
+  render() {
+    return html`<div>Content</div>`;
+  }
+}
+```
+
+### Component Guidelines
+
+- **Use composition**: Prefer composition over inheritance
+- **Lazy load panels**: Heavy panels should be dynamically imported
+- **Optimize renders**: Use `@state()` for internal state, `@property()` for public API
+- **Handle loading states**: Always show appropriate loading indicators
+- **Support themes**: Use CSS custom properties from theme
+
+### Data Management
+
+- **Use WebSocket API**: All backend communication via home-assistant-js-websocket
+- **Prefer contexts over `hass`**: For state reads, consume the relevant Lit context instead of taking the whole `hass` object — see [State Access: Contexts Instead of `hass`](#state-access-contexts-instead-of-hass)
+- **Cache appropriately**: Use collections and caching for frequently accessed data
+- **Handle errors gracefully**: All API calls should have error handling
+- **Update real-time**: Subscribe to state changes for live updates
+
+```typescript
+// Good
+try {
+  const result = await fetchEntityRegistry(this.hass.connection);
+  this._processResult(result);
+} catch (err) {
+  showAlertDialog(this, {
+    text: `Failed to load: ${err.message}`,
+  });
+}
+```
+
+### Styling Guidelines
+
+- **Use CSS custom properties**: Leverage the theme system
+- **Use spacing tokens**: Prefer `--ha-space-*` tokens over hardcoded values for consistent spacing
+  - Spacing scale: `--ha-space-1` (4px) through `--ha-space-20` (80px) in 4px increments
+  - Defined in `src/resources/theme/core.globals.ts`
+  - Common values: `--ha-space-2` (8px), `--ha-space-4` (16px), `--ha-space-8` (32px)
+- **Mobile-first responsive**: Design for mobile, enhance for desktop
+- **Prefer `ha-*` components**: Build on the Home Assistant component library (many now wrap Web Awesome components); avoid new use of legacy Material Web Components (`mwc-*`), which are being phased out
+- **Support RTL**: Ensure all layouts work in RTL languages
+
+```typescript
+static get styles() {
+  return css`
+    :host {
+      padding: var(--ha-space-4);
+      color: var(--primary-text-color);
+      background-color: var(--card-background-color);
+    }
+
+    .content {
+      gap: var(--ha-space-2);
+    }
+
+    @media (max-width: 600px) {
+      :host {
+        padding: var(--ha-space-2);
+      }
+    }
+  `;
+}
+```
+
+### View Transitions
+
+The View Transitions API creates smooth animations between DOM state changes. When implementing view transitions:
+
+**Core Resources:**
+
+- **Utility wrapper**: `src/common/util/view-transition.ts` - `withViewTransition()` function with graceful fallback
+- **Real-world example**: `src/util/launch-screen.ts` - Launch screen fade pattern with browser support detection
+- **Animation keyframes**: `src/resources/theme/animations.globals.ts` - Global `fade-in`, `fade-out`, `scale` animations
+- **Animation duration**: `src/resources/theme/core.globals.ts` - `--ha-animation-duration-fast` (150ms), `--ha-animation-duration-normal` (250ms), `--ha-animation-duration-slow` (350ms) (all respect `prefers-reduced-motion`)
+
+**Implementation Guidelines:**
+
+1. Always use `withViewTransition()` wrapper for automatic fallback
+2. Keep transitions simple (subtle crossfades and fades work best)
+3. Use `--ha-animation-duration-*` CSS variables for consistent timing (`fast`, `normal`, `slow`)
+4. Assign unique `view-transition-name` to elements (must be unique at any given time)
+5. For Lit components: Override `performUpdate()` or use `::part()` for internal elements
+
+**Default Root Transition:**
+
+By default, `:root` receives `view-transition-name: root`, creating a full-page crossfade. Target with [`::view-transition-group(root)`](https://developer.mozilla.org/en-US/docs/Web/CSS/::view-transition-group) to customize the default page transition.
+
+**Important Constraints:**
+
+- Each `view-transition-name` must be unique at any given time
+- Only one view transition can run at a time
+- **Shadow DOM incompatibility**: View transitions operate at document level and do not work within Shadow DOM due to style isolation ([spec discussion](https://github.com/w3c/csswg-drafts/issues/10303)). For web components, set `view-transition-name` on the `:host` element or use document-level transitions
+
+**Specification & Documentation:**
+
+For browser support, API details, and current specifications, refer to these authoritative sources (note: check publication dates as specs evolve):
+
+- [MDN: View Transition API](https://developer.mozilla.org/en-US/docs/Web/API/View_Transition_API) - Comprehensive API reference
+- [Chrome for Developers: View Transitions](https://developer.chrome.com/docs/web-platform/view-transitions) - Implementation guide and examples
+- [W3C Draft Specification](https://drafts.csswg.org/css-view-transitions/) - Official specification (evolving)
+
+### Performance Best Practices
+
+- **Code split**: Split code at the panel/dialog level
+- **Lazy load**: Use dynamic imports for heavy components
+- **Optimize bundle**: Keep initial bundle size minimal
+- **Use virtual scrolling**: For long lists, implement virtual scrolling
+- **Memoize computations**: Cache expensive calculations
+
+### Testing Requirements
+
+- **Write tests**: Add tests for data processing and utilities
+- **Test with Vitest**: Use the established test framework
+- **Mock appropriately**: Mock WebSocket connections and API calls
+- **Test accessibility**: Ensure components are accessible
+- **Optimizing chart data processing**: When optimizing chart data transforms (history, statistics, energy, downsampling), follow the playbook in [`test/benchmarks/README.md`](test/benchmarks/README.md) — it has seeded fixtures, characterization (snapshot) tests that pin current output, and `vitest bench` benchmarks (`yarn test:bench`) for before/after comparison. Optimizations must keep output bit-identical.
+
+## Component Library
+
+### Dialog Component
+
+**Opening Dialogs (Fire Event Pattern - Recommended):**
+
+```typescript
+fireEvent(this, "show-dialog", {
+  dialogTag: "dialog-example",
+  dialogImport: () => import("./dialog-example"),
+  dialogParams: { title: "Example", data: someData },
+});
+```
+
+**Dialog Implementation Requirements:**
+
+- Use `ha-dialog` component
+- Implement `HassDialog<T>` interface
+- Use `@state() private _open = false` to control dialog visibility
+- Set `_open = true` in `showDialog()`, `_open = false` in `closeDialog()`
+- Return `nothing` when no params (loading state)
+- Fire `dialog-closed` event in `_dialogClosed()` handler
+- Use `header-title` attribute for simple titles
+- Use `header-subtitle` attribute for simple subtitles
+- Use slots for custom content where the standard attributes are not enough
+- Use `ha-dialog-footer` with `primaryAction`/`secondaryAction` slots for footer content
+- Add `autofocus` to first focusable element (e.g., `<ha-form autofocus>`). The component may need to forward this attribute internally.
+
+**Dialog Sizing:**
+
+- Use `width` attribute with predefined sizes: `"small"` (320px), `"medium"` (580px - default), `"large"` (1024px), or `"full"`
+- Custom sizing is NOT recommended - use the standard width presets
+
+**Button Appearance Guidelines:**
+
+`ha-button` (wraps the Web Awesome button — see `src/components/ha-button.ts`) has two independent axes plus size:
+
+- **`variant`** (color): `"brand"` (default), `"neutral"`, `"danger"`, `"warning"`, `"success"`
+- **`appearance`** (fill style): `"accent"`, `"filled"`, `"outlined"`, `"plain"`
+- **`size`**: `"xs"` (extra small, 40px), `"s"` (small, 32px), `"m"` (medium, 40px - default), `"l"` (large, 48px), `"xl"` (extra large, 40px)
+
+Common patterns:
+
+- **Primary action**: `appearance="filled"` for emphasis (or the default appearance for a lighter look)
+- **Secondary action**: `appearance="plain"` for cancel/dismiss actions
+- **Destructive actions**: `variant="danger"` for delete/remove operations (the generic confirmation dialog uses `variant="danger"` for its confirm button — see `src/dialogs/generic/dialog-box.ts`)
+- Always place primary action in `slot="primaryAction"` and secondary in `slot="secondaryAction"` within `ha-dialog-footer`
+
+### Form Component (ha-form)
+
+- Schema-driven using `HaFormSchema[]`
+- Supports entity, device, area, target, number, boolean, time, action, text, object, select, icon, media, location selectors
+- Built-in validation with error display
+- Use `computeLabel`, `computeError`, `computeHelper` for translations
+
+```typescript
+<ha-form
+  .hass=${this.hass}
+  .data=${this._data}
+  .schema=${this._schema}
+  .error=${this._errors}
+  .computeLabel=${(schema) => this.hass.localize(`ui.panel.${schema.name}`)}
+  @value-changed=${this._valueChanged}
+></ha-form>
+```
+
+### Alert Component (ha-alert)
+
+- Types: `error`, `warning`, `info`, `success`
+- Properties: `title`, `alert-type`, `dismissable`, `narrow`
+- Slots: `icon` (override the leading icon), `action` (custom action content)
+- Content announced by screen readers when dynamically displayed
+
+```html
+<ha-alert alert-type="error">Error message</ha-alert>
+<ha-alert alert-type="warning" title="Warning">Description</ha-alert>
+<ha-alert alert-type="success" dismissable>Success message</ha-alert>
+```
+
+### Keyboard Shortcuts (ShortcutManager)
+
+The `ShortcutManager` class provides a unified way to register keyboard shortcuts with automatic input field protection.
+
+**Key Features:**
+
+- Automatically blocks shortcuts when input fields are focused
+- Prevents shortcuts during text selection (configurable via `allowWhenTextSelected`)
+- Supports both character-based and KeyCode-based shortcuts (for non-latin keyboards)
+
+**Implementation:**
+
+- **Class definition**: `src/common/keyboard/shortcuts.ts`
+- **Real-world example**: `src/state/quick-bar-mixin.ts` - Global shortcuts (e, c, d, m, a, Shift+?) with non-latin keyboard fallbacks
+
+### Tooltip Component (ha-tooltip)
+
+The `ha-tooltip` component wraps Web Awesome tooltip with Home Assistant theming. Use for providing contextual help text on hover.
+
+**Implementation:**
+
+- **Component definition**: `src/components/ha-tooltip.ts`
+- **Usage example**: `src/components/ha-label.ts`
+
+## Common Patterns
+
+### Creating a Panel
+
+```typescript
+@customElement("ha-panel-myfeature")
+export class HaPanelMyFeature extends SubscribeMixin(LitElement) {
+  @property({ attribute: false })
+  hass!: HomeAssistant;
+
+  @property({ type: Boolean, reflect: true })
+  narrow!: boolean;
+
+  @property()
+  route!: Route;
+
+  hassSubscribe() {
+    return [
+      subscribeEntityRegistry(this.hass.connection, (entities) => {
+        this._entities = entities;
+      }),
+    ];
+  }
+}
+```
+
+#### Creating a Lovelace Card
+
+**Purpose**: Cards allow users to tell different stories about their house.
+
+```typescript
+@customElement("hui-my-card")
+export class HuiMyCard extends LitElement implements LovelaceCard {
+  @property({ attribute: false })
+  hass!: HomeAssistant;
+
+  @state()
+  private _config?: MyCardConfig;
+
+  public setConfig(config: MyCardConfig): void {
+    if (!config.entity) {
+      throw new Error("Entity required");
+    }
+    this._config = config;
+  }
+
+  public getCardSize(): number {
+    return 3; // Height in grid units
+  }
+
+  // Optional: Editor for card configuration
+  public static getConfigElement(): LovelaceCardEditor {
+    return document.createElement("hui-my-card-editor");
+  }
+
+  // Optional: Stub config for card picker
+  public static getStubConfig(): object {
+    return { entity: "" };
+  }
+}
+```
+
+**Card Guidelines:**
+
+- Cards are highly customizable for different households
+- Implement `LovelaceCard` interface with `setConfig()` and `getCardSize()`
+- Use proper error handling in `setConfig()`
+- Consider all possible states (loading, error, unavailable)
+- Support different entity types and states
+- Follow responsive design principles
+- Add configuration editor when needed
+
+### Internationalization
+
+- **Use localize**: Always use the localization system
+- **Add translation keys**: Add keys to src/translations/en.json
+- **Support placeholders**: Use proper placeholder syntax
+
+```typescript
+this.hass.localize("ui.panel.config.updates.update_available", {
+  count: 5,
+});
+```
+
+### Accessibility
+
+- **ARIA labels**: Add appropriate ARIA labels
+- **Keyboard navigation**: Ensure all interactions work with keyboard
+- **Screen reader support**: Test with screen readers
+- **Color contrast**: Meet WCAG AA standards
+
+## Development Workflow
+
+### Setup and Commands
+
+1. **Setup**: `script/setup` - Install dependencies
+2. **Develop**: `script/develop` - Development server
+3. **Lint**: `yarn lint` - Run all linting before committing
+4. **Test**: `yarn test` - Add and run tests
+5. **Build**: `script/build_frontend` - Test production build
+
+### Gallery
+
+For Gallery-specific structure, page/demo naming, sidebar behavior, content standards, and commands, see [`gallery/AGENTS.md`](gallery/AGENTS.md).
+
+### Common Pitfalls to Avoid
+
+- Don't manually query the DOM with `querySelector` - use the `@query`/`@queryAll` decorators or component properties
+- Don't manipulate DOM directly - Let Lit handle rendering
+- Don't use global styles - Scope styles to components
+- Don't block the main thread - Use web workers for heavy computation
+- Don't ignore TypeScript errors - Fix all type issues
+
+### Security Best Practices
+
+- Sanitize HTML - Never use `unsafeHTML` with user content
+- Validate inputs - Always validate user inputs
+- Use HTTPS - All external resources must use HTTPS
+- CSP compliance - Ensure code works with Content Security Policy
+
+### Pull Requests
+
+When creating a pull request, you **must** use the PR template located at `.github/PULL_REQUEST_TEMPLATE.md`. Read the template file and use its full content as the PR body, filling in each section appropriately.
+
+- Do not omit, reorder, or rewrite the template sections
+- Check the appropriate "Type of change" box based on the changes
+- Do not check the checklist items on behalf of the user — those are the user's responsibility to review and check
+- If the PR includes UI changes, remind the user to add screenshots or a short video to the PR after creating it
+- Be simple and user friendly — explain what the change does, not implementation details
+- Use markdown so the user can copy it
+
+### Text and Copy Guidelines
+
+#### Terminology Standards
+
+**Delete vs Remove**
+
+- **Use "Remove"** for actions that can be restored or reapplied:
+  - Removing a user's permission
+  - Removing a user from a group
+  - Removing links between items
+  - Removing a widget from dashboard
+  - Removing an item from a cart
+- **Use "Delete"** for permanent, non-recoverable actions:
+  - Deleting a field
+  - Deleting a value in a field
+  - Deleting a task
+  - Deleting a group
+  - Deleting a permission
+  - Deleting a calendar event
+
+**Create vs Add** (Create pairs with Delete, Add pairs with Remove)
+
+- **Use "Add"** for already-existing items:
+  - Adding a permission to a user
+  - Adding a user to a group
+  - Adding links between items
+  - Adding a widget to dashboard
+  - Adding an item to a cart
+- **Use "Create"** for something made from scratch:
+  - Creating a new field
+  - Creating a new task
+  - Creating a new group
+  - Creating a new permission
+  - Creating a new calendar event
+
+#### Writing Style (Consistent with Home Assistant Documentation)
+
+- **Use American English**: Standard spelling and terminology
+- **Friendly, informational tone**: Be inspiring, personal, comforting, engaging
+- **Address users directly**: Use "you" and "your"
+- **Be inclusive**: Objective, non-discriminatory language
+- **Be concise**: Use clear, direct language
+- **Be consistent**: Follow established terminology patterns
+- **Use active voice**: "Delete the automation" not "The automation should be deleted"
+- **Avoid jargon**: Use terms familiar to home automation users
+
+#### Language Standards
+
+- **Always use "Home Assistant"** in full, never "HA" or "HASS"
+- **Avoid abbreviations**: Spell out terms when possible
+- **Use sentence case everywhere**: Titles, headings, buttons, labels, UI elements
+  - ✅ "Create new automation"
+  - ❌ "Create New Automation"
+  - ✅ "Device settings"
+  - ❌ "Device Settings"
+- **Oxford comma**: Use in lists (item 1, item 2, and item 3)
+- **Replace Latin terms**: Use "like" instead of "e.g.", "for example" instead of "i.e."
+- **Avoid CAPS for emphasis**: Use bold or italics instead
+- **Write for all skill levels**: Both technical and non-technical users
+
+#### Key Terminology
+
+- **"integration"** (preferred over "component")
+- **Technical terms**: Use lowercase (automation, entity, device, service)
+
+#### Translation Considerations
+
+All user-facing text must be translatable — see the **Internationalization** section (under Common Patterns) for the `localize` API and placeholder usage. From a copy perspective:
+
+- **Keep context**: Provide enough context for translators
+- **Avoid concatenation**: Prefer full localized strings with placeholders over stitching translated fragments together
+
+### Common Review Issues (From PR Analysis)
+
+Recurring, easy-to-miss problems surfaced in real PR reviews. These complement the standards above rather than repeating them — items already covered earlier (loading states, error handling, mobile layout, theming, import hygiene) are intentionally not duplicated here.
+
+#### User Experience and Accessibility
+
+- **Form validation**: Always provide proper field labels and validation feedback
+- **Form accessibility**: Prevent password managers from incorrectly identifying fields
+- **Hit targets**: Make clickable areas large enough for touch interaction
+- **Visual feedback**: Provide clear indication of interactive states (hover, active, focus)
+
+#### Dialog and Modal Patterns
+
+- **Interview progress**: Show clear progress for multi-step operations
+- **State persistence**: Handle dialog state properly during background operations
+- **Cancel behavior**: Ensure cancel/close buttons work consistently
+- **Form prefilling**: Use smart defaults but allow user override
+
+#### Component Design Patterns
+
+- **Terminology consistency**: Use "Join"/"Apply" instead of "Group" when appropriate
+- **Visual hierarchy**: Ensure proper font sizes and spacing ratios
+- **Grid alignment**: Components should align to the design grid system
+- **Badge placement**: Position badges and indicators consistently
+
+#### Code Quality Issues
+
+- **Null checking**: Always check if entities exist before accessing properties
+- **TypeScript safety**: Handle potentially undefined array/object access
+- **Event handling and cleanup**: Subscribe/unsubscribe correctly and remove listeners to avoid memory leaks
+
+#### Configuration and Props
+
+- **Optional parameters**: Make configuration fields optional when sensible
+- **Smart defaults**: Provide reasonable default values
+- **Future extensibility**: Design APIs that can be extended later
+- **Validation**: Validate configuration before applying changes
+
+## Review Guidelines
+
+Final pre-submission checklist. Linting and formatting are enforced by tooling, so this focuses on what tools can't catch rather than restating every rule above.
+
+- [ ] `yarn lint` passes (TypeScript, ESLint, Prettier, Lit analyzer) and `yarn test` is green
+- [ ] Tests added for new data processing/utilities (where applicable)
+- [ ] All user-facing text is localized and follows the Text and Copy guidelines (sentence case, "Home Assistant" in full, Delete/Remove + Create/Add)
+- [ ] Components handle all states (loading, error, unavailable)
+- [ ] Entity existence checked before property access
+- [ ] Event/subscription listeners cleaned up (no memory leaks)
+- [ ] Accessible to screen readers and keyboard

.github/dependabot.yml

@@ -1,24 +1,13 @@
 version: 2
 updates:
   - package-ecosystem: "github-actions"
-    # Dependabot only scans .github/workflows by default; composite actions
-    # under .github/actions must be listed explicitly to stay updated.
-    # https://github.com/dependabot/dependabot-core/issues/6704
-    directories:
-      - "/"
-      - "/.github/actions/setup"
-      - "/.github/actions/build"
-      - "/.github/actions/netlify-deploy"
+    directory: "/"
     schedule:
       interval: weekly
       time: "06:00"
     cooldown:
       default-days: 7
     open-pull-requests-limit: 10
-    groups:
-      codeql-action:
-        patterns:
-          - "github/codeql-action/*"
     labels:
       - Dependencies
       - GitHub Actions

.github/labeler.yml

@@ -1,21 +1,3 @@
-Agents:
-  - changed-files:
-      - any-glob-to-any-file:
-          - "**/AGENTS.md"
-          - "**/CLAUDE.md"
-          - "**/GEMINI.md"
-          - .agents/**
-          - .claude/**
-          - .github/agents/**
-          - .github/copilot-instructions.md
-          - .github/hooks/**
-          - .github/instructions/**
-          - .github/plugin.json
-          - .github/plugin/**
-          - .github/prompts/**
-          - .github/skills/**
-          - .github/workflows/copilot-setup-steps.yml
-
 Build:
   - changed-files:
       - any-glob-to-any-file:
@@ -60,36 +42,5 @@ Dependencies:
 GitHub Actions:
   - changed-files:
       - any-glob-to-any-file:
-          - .github/actions/**
           - .github/workflows/**
           - .github/*.yml
-
-"Tests: E2E":
-  - changed-files:
-      - any-glob-to-any-file:
-          - test/e2e/**
-
-"Tests: App":
-  - changed-files:
-      - any-glob-to-any-file:
-          - test/e2e/app.spec.ts
-          - test/e2e/app/**
-          - test/e2e/playwright.app.config.ts
-
-"Tests: Demo":
-  - changed-files:
-      - any-glob-to-any-file:
-          - test/e2e/demo.spec.ts
-          - test/e2e/playwright.demo.config.ts
-
-"Tests: Design":
-  - changed-files:
-      - any-glob-to-any-file:
-          - test/e2e/gallery.spec.ts
-          - test/e2e/playwright.gallery.config.ts
-
-"Tests: Unit":
-  - changed-files:
-      - any-glob-to-any-file:
-          - test/*.ts
-          - "test/!(e2e)/**"

.github/scripts/check-task-authorization.mjs

@@ -1,7 +1,7 @@
 #!/usr/bin/env node
 // Restricts Task issues to organization members: closes and labels the issue with
 // an explanatory comment when the author is not an org member. Invoked from the
-// `check-authorization` job in .github/workflows/restrict-task-creation.yaml via
+// `check-authorization` job in .github/workflows/restrict-task-creation.yml via
 // actions/github-script:
 //
 //   const { default: checkTaskAuthorization } =

.github/workflows/actionlint.yaml

@@ -1,42 +0,0 @@
-name: Lint workflow files
-
-on:
-  push:
-    branches:
-      - dev
-      - master
-    paths:
-      - ".github/actions/**"
-      - ".github/workflows/**"
-  pull_request:
-    branches:
-      - dev
-      - master
-    paths:
-      - ".github/actions/**"
-      - ".github/workflows/**"
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
-  cancel-in-progress: true
-
-permissions:
-  contents: read
-
-jobs:
-  actionlint:
-    name: Check workflow files
-    runs-on: ubuntu-latest
-    env:
-      # renovate: datasource=github-releases depName=rhysd/actionlint
-      ACTIONLINT_VERSION: 1.7.12
-    steps:
-      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
-        with:
-          persist-credentials: false
-      - name: Run actionlint
-        run: |
-          curl -sSfL "https://github.com/rhysd/actionlint/releases/download/v${ACTIONLINT_VERSION}/actionlint_${ACTIONLINT_VERSION}_linux_amd64.tar.gz" \
-            | tar -xz actionlint
-          ./actionlint -color

.github/workflows/cast_deployment.yaml

@@ -21,7 +21,7 @@ jobs:
     if: github.event_name != 'push'
     environment:
       name: Cast Development
-      url: ${{ steps.deploy.outputs.netlify_url }}
+      url: ${{ steps.deploy.outputs.NETLIFY_LIVE_URL || steps.deploy.outputs.NETLIFY_URL }}
     steps:
       - name: Check out files from GitHub
         uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
@@ -29,23 +29,27 @@ jobs:
           ref: dev
           persist-credentials: false
 
-      - name: Setup Node and install
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
+        with:
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn install --immutable
 
       - name: Build Cast
-        uses: ./.github/actions/build
-        with:
-          target: build-cast
-          github-token: ${{ secrets.GITHUB_TOKEN }}
+        run: ./node_modules/.bin/gulp build-cast
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Deploy to Netlify
         id: deploy
-        uses: ./.github/actions/netlify-deploy
-        with:
-          dir: cast/dist
-          alias: dev
-          auth-token: ${{ secrets.NETLIFY_AUTH_TOKEN }}
-          site-id: ${{ secrets.NETLIFY_CAST_SITE_ID }}
+        run: |
+          npx -y netlify-cli deploy --dir=cast/dist --alias dev
+        env:
+          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
+          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_CAST_SITE_ID }}
 
   deploy_master:
     runs-on: ubuntu-latest
@@ -53,7 +57,7 @@ jobs:
     if: github.event_name == 'push'
     environment:
       name: Cast Production
-      url: ${{ steps.deploy.outputs.netlify_url }}
+      url: ${{ steps.deploy.outputs.NETLIFY_LIVE_URL || steps.deploy.outputs.NETLIFY_URL }}
     steps:
       - name: Check out files from GitHub
         uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
@@ -61,19 +65,24 @@ jobs:
           ref: master
           persist-credentials: false
 
-      - name: Setup Node and install
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
+        with:
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn install --immutable
 
       - name: Build Cast
-        uses: ./.github/actions/build
-        with:
-          target: build-cast
-          github-token: ${{ secrets.GITHUB_TOKEN }}
+        run: ./node_modules/.bin/gulp build-cast
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Deploy to Netlify
         id: deploy
-        uses: ./.github/actions/netlify-deploy
-        with:
-          dir: cast/dist
-          auth-token: ${{ secrets.NETLIFY_AUTH_TOKEN }}
-          site-id: ${{ secrets.NETLIFY_CAST_SITE_ID }}
+        run: |
+          npx -y netlify-cli deploy --dir=cast/dist --prod
+        env:
+          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
+          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_CAST_SITE_ID }}

.github/workflows/ci.yaml

@@ -1,7 +1,6 @@
 name: CI
 
 on:
-  workflow_dispatch:
   push:
     branches:
       - dev
@@ -13,6 +12,7 @@ on:
 
 env:
   NODE_OPTIONS: --max_old_space_size=6144
+  GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
 concurrency:
   group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
@@ -22,39 +22,27 @@ permissions:
   contents: read
 
 jobs:
-  prepare-dependencies:
-    name: Prepare dependencies
-    runs-on: ubuntu-latest
-    steps:
-      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
-        with:
-          persist-credentials: false
-      - name: Prepare dependencies
-        uses: ./.github/actions/prepare-dependencies
-
   lint:
     name: Lint and check format
-    needs: prepare-dependencies
     runs-on: ubuntu-latest
     steps:
       - name: Check out files from GitHub
         uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
         with:
           persist-credentials: false
-      - name: Setup Node with shared dependencies
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
-          node-modules-cache: true
+          node-version-file: ".nvmrc"
+          cache: yarn
+      - name: Install dependencies
+        run: yarn install --immutable
       - name: Check for duplicate dependencies
         run: yarn dedupe --check
       - name: Build resources
-        id: build_resources
         run: ./node_modules/.bin/gulp gen-icons-json build-translations build-locale-data gather-gallery-pages
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
       - name: Setup lint cache
-        uses: actions/cache@55cc8345863c7cc4c66a329aec7e433d2d1c52a9 # v6.1.0
+        uses: actions/cache@27d5ce7f107fe9357f9df03efb73ab90386fccae # v5.0.5
         with:
           path: |
             node_modules/.cache/prettier
@@ -65,58 +53,52 @@ jobs:
       - name: Run eslint
         run: yarn run lint:eslint --quiet
       - name: Run tsc
-        if: ${{ !cancelled() && steps.build_resources.outcome == 'success' }}
         run: yarn run lint:types
       - name: Run lit-analyzer
-        if: ${{ !cancelled() && steps.build_resources.outcome == 'success' }}
         run: yarn run lint:lit --quiet
       - name: Run prettier
-        if: ${{ !cancelled() && steps.build_resources.outcome == 'success' }}
         run: yarn run lint:prettier
       - name: Check dependency licenses
-        if: ${{ !cancelled() && steps.build_resources.outcome == 'success' }}
         run: yarn run lint:licenses
   test:
     name: Run tests
-    needs: prepare-dependencies
     runs-on: ubuntu-latest
     steps:
       - name: Check out files from GitHub
         uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
         with:
           persist-credentials: false
-      - name: Setup Node with shared dependencies
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
-          node-modules-cache: true
+          node-version-file: ".nvmrc"
+          cache: yarn
+      - name: Install dependencies
+        run: yarn install --immutable
       - name: Build resources
         run: ./node_modules/.bin/gulp gen-icons-json build-translations build-locale-data
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
       - name: Run Tests
         run: yarn run test
   build:
     name: Build frontend
-    needs:
-      - prepare-dependencies
-      - lint
-      - test
+    needs: [lint, test]
     runs-on: ubuntu-latest
     steps:
       - name: Check out files from GitHub
         uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
         with:
           persist-credentials: false
-      - name: Setup Node with shared dependencies
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
-          node-modules-cache: true
+          node-version-file: ".nvmrc"
+          cache: yarn
+      - name: Install dependencies
+        run: yarn install --immutable
       - name: Build Application
-        uses: ./.github/actions/build
-        with:
-          target: build-app
-          github-token: ${{ secrets.GITHUB_TOKEN }}
-          is-test: true
+        run: ./node_modules/.bin/gulp build-app
+        env:
+          IS_TEST: "true"
       - name: Upload bundle stats
         uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
         with:

.github/workflows/codeql-analysis.yaml

@@ -1,43 +0,0 @@
-name: "CodeQL"
-
-on:
-  push:
-    branches:
-      - dev
-      - master
-  pull_request:
-    # The branches below must be a subset of the branches above
-    branches:
-      - dev
-
-permissions: {}
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: true
-
-jobs:
-  analyze:
-    name: Analyze
-    runs-on: ubuntu-latest
-    timeout-minutes: 360
-    permissions:
-      contents: read # To check out the repository
-      security-events: write # To upload CodeQL results
-
-    steps:
-      - name: Check out code from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
-        with:
-          persist-credentials: false
-
-      - name: Initialize CodeQL
-        uses: github/codeql-action/init@99df26d4f13ea111d4ec1a7dddef6063f76b97e9 # v4.37.0
-        with:
-          languages: javascript-typescript
-          build-mode: none
-
-      - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@99df26d4f13ea111d4ec1a7dddef6063f76b97e9 # v4.37.0
-        with:
-          category: "/language:javascript-typescript"

.github/workflows/codeql-analysis.yml

@@ -0,0 +1,65 @@
+name: "CodeQL"
+
+on:
+  push:
+    branches: [dev, master]
+  pull_request:
+    # The branches below must be a subset of the branches above
+    branches: [dev]
+
+permissions:
+  contents: read
+  security-events: write
+
+jobs:
+  analyze:
+    name: Analyze
+    runs-on: ubuntu-latest
+
+    strategy:
+      fail-fast: false
+      matrix:
+        # Override automatic language detection by changing the below list
+        # Supported options are ['csharp', 'cpp', 'go', 'java', 'javascript', 'python']
+        language: ["javascript"]
+        # Learn more...
+        # https://docs.github.com/en/github/finding-security-vulnerabilities-and-errors-in-your-code/configuring-code-scanning#overriding-automatic-language-detection
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
+        with:
+          # We must fetch at least the immediate parents so that if this is
+          # a pull request then we can checkout the head.
+          fetch-depth: 2
+          persist-credentials: false
+
+      # If this run was triggered by a pull request event, then checkout
+      # the head of the pull request instead of the merge commit.
+      - run: git checkout HEAD^2
+        if: ${{ github.event_name == 'pull_request' }}
+
+      # Initializes the CodeQL tools for scanning.
+      - name: Initialize CodeQL
+        uses: github/codeql-action/init@8aad20d150bbac5944a9f9d289da16a4b0d87c1e # v4.36.2
+        with:
+          languages: ${{ matrix.language }}
+
+      # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
+      # If this step fails, then you should remove it and run the build manually (see below)
+      - name: Autobuild
+        uses: github/codeql-action/autobuild@8aad20d150bbac5944a9f9d289da16a4b0d87c1e # v4.36.2
+
+      # ℹ️ Command-line programs to run using the OS shell.
+      # 📚 https://git.io/JvXDl
+
+      # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
+      #    and modify them (or add more) to build your code if your project
+      #    uses a compiled language
+
+      #- run: |
+      #   make bootstrap
+      #   make release
+
+      - name: Perform CodeQL Analysis
+        uses: github/codeql-action/analyze@8aad20d150bbac5944a9f9d289da16a4b0d87c1e # v4.36.2

.github/workflows/demo_deployment.yaml

@@ -22,7 +22,7 @@ jobs:
     if: github.event_name != 'push' || github.ref_name != 'master'
     environment:
       name: Demo Development
-      url: ${{ steps.deploy.outputs.unique_deploy_url }}
+      url: ${{ steps.deploy.outputs.NETLIFY_LIVE_URL || steps.deploy.outputs.NETLIFY_URL }}
     steps:
       - name: Check out files from GitHub
         uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
@@ -30,22 +30,27 @@ jobs:
           ref: dev
           persist-credentials: false
 
-      - name: Setup Node and install
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
+        with:
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn install --immutable
 
       - name: Build Demo
-        uses: ./.github/actions/build
-        with:
-          target: build-demo
-          github-token: ${{ secrets.GITHUB_TOKEN }}
+        run: ./node_modules/.bin/gulp build-demo
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Deploy to Netlify
         id: deploy
-        uses: ./.github/actions/netlify-deploy
-        with:
-          dir: demo/dist
-          auth-token: ${{ secrets.NETLIFY_AUTH_TOKEN }}
-          site-id: ${{ secrets.NETLIFY_DEMO_DEV_SITE_ID }}
+        run: |
+          npx -y netlify-cli deploy --dir=demo/dist --prod
+        env:
+          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
+          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_DEMO_DEV_SITE_ID }}
 
   deploy_master:
     runs-on: ubuntu-latest
@@ -53,7 +58,7 @@ jobs:
     if: github.event_name == 'push' && github.ref_name == 'master'
     environment:
       name: Demo Production
-      url: ${{ steps.deploy.outputs.netlify_url }}
+      url: ${{ steps.deploy.outputs.NETLIFY_LIVE_URL || steps.deploy.outputs.NETLIFY_URL }}
     steps:
       - name: Check out files from GitHub
         uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
@@ -61,19 +66,24 @@ jobs:
           ref: master
           persist-credentials: false
 
-      - name: Setup Node and install
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
+        with:
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn install --immutable
 
       - name: Build Demo
-        uses: ./.github/actions/build
-        with:
-          target: build-demo
-          github-token: ${{ secrets.GITHUB_TOKEN }}
+        run: ./node_modules/.bin/gulp build-demo
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Deploy to Netlify
         id: deploy
-        uses: ./.github/actions/netlify-deploy
-        with:
-          dir: demo/dist
-          auth-token: ${{ secrets.NETLIFY_AUTH_TOKEN }}
-          site-id: ${{ secrets.NETLIFY_DEMO_SITE_ID }}
+        run: |
+          npx -y netlify-cli deploy --dir=demo/dist --prod
+        env:
+          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
+          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_DEMO_SITE_ID }}

.github/workflows/design_deployment.yaml

@@ -16,26 +16,31 @@ jobs:
     runs-on: ubuntu-latest
     environment:
       name: Design
-      url: ${{ steps.deploy.outputs.netlify_url }}
+      url: ${{ steps.deploy.outputs.NETLIFY_LIVE_URL || steps.deploy.outputs.NETLIFY_URL }}
     steps:
       - name: Check out files from GitHub
         uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
         with:
           persist-credentials: false
 
-      - name: Setup Node and install
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
+        with:
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn install --immutable
 
       - name: Build Gallery
-        uses: ./.github/actions/build
-        with:
-          target: build-gallery
-          github-token: ${{ secrets.GITHUB_TOKEN }}
+        run: ./node_modules/.bin/gulp build-gallery
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Deploy to Netlify
         id: deploy
-        uses: ./.github/actions/netlify-deploy
-        with:
-          dir: gallery/dist
-          auth-token: ${{ secrets.NETLIFY_AUTH_TOKEN }}
-          site-id: ${{ secrets.NETLIFY_GALLERY_SITE_ID }}
+        run: |
+          npx -y netlify-cli deploy --dir=gallery/dist --prod
+        env:
+          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
+          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_GALLERY_SITE_ID }}

.github/workflows/design_preview.yaml

@@ -28,23 +28,30 @@ jobs:
         with:
           persist-credentials: false
 
-      - name: Setup Node and install
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
+        with:
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn install --immutable
 
       - name: Build Gallery
-        uses: ./.github/actions/build
-        with:
-          target: build-gallery
-          github-token: ${{ secrets.GITHUB_TOKEN }}
+        run: ./node_modules/.bin/gulp build-gallery
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Deploy preview to Netlify
         id: deploy
-        uses: ./.github/actions/netlify-deploy
-        with:
-          dir: gallery/dist
-          alias: deploy-preview-${{ github.event.number }}
-          auth-token: ${{ secrets.NETLIFY_AUTH_TOKEN }}
-          site-id: ${{ secrets.NETLIFY_GALLERY_SITE_ID }}
+        run: |
+          npx -y netlify-cli deploy --dir=gallery/dist --alias "deploy-preview-${{ github.event.number }}" \
+            --json > deploy_output.json
+        env:
+          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
+          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_GALLERY_SITE_ID }}
 
       - name: Generate summary
-        run: echo "${{ steps.deploy.outputs.netlify_url }}" >> "$GITHUB_STEP_SUMMARY"
+        run: |
+          NETLIFY_LIVE_URL=$(jq -r '.deploy_url' deploy_output.json)
+          echo "$NETLIFY_LIVE_URL" >> "$GITHUB_STEP_SUMMARY"

.github/workflows/e2e.yaml

@@ -22,42 +22,9 @@ permissions:
   contents: read
 
 jobs:
-  prepare-dependencies:
-    name: Prepare dependencies
-    runs-on: ubuntu-latest
-    steps:
-      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
-        with:
-          persist-credentials: false
-
-      - name: Prepare dependencies
-        uses: ./.github/actions/prepare-dependencies
-
-  prepare-container-dependencies:
-    name: Prepare container dependencies
-    runs-on: ubuntu-latest
-    container:
-      image: mcr.microsoft.com/playwright:v1.61.1-noble
-      options: --user 1001
-    defaults:
-      run:
-        shell: bash
-    steps:
-      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
-        with:
-          persist-credentials: false
-
-      - name: Prepare dependencies
-        uses: ./.github/actions/prepare-dependencies
-        with:
-          node-modules-cache-key: node-modules-container-v1
-
   # ── Build the demo once and share it across test jobs via artifact ──────────
   build-demo:
     name: Build demo
-    needs: prepare-dependencies
     runs-on: ubuntu-latest
     steps:
       - name: Check out files from GitHub
@@ -65,17 +32,19 @@ jobs:
         with:
           persist-credentials: false
 
-      - name: Setup Node with shared dependencies
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
-          node-modules-cache: true
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn install --immutable
 
       - name: Build demo
-        uses: ./.github/actions/build
-        with:
-          target: build-demo-e2e
-          github-token: ${{ secrets.GITHUB_TOKEN }}
-          is-test: true
+        run: ./node_modules/.bin/gulp build-demo
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Upload demo build
         uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
@@ -88,7 +57,6 @@ jobs:
   # ── Build the e2e test app and share it via artifact ────────────────────────
   build-e2e-test-app:
     name: Build e2e test app
-    needs: prepare-dependencies
     runs-on: ubuntu-latest
     steps:
       - name: Check out files from GitHub
@@ -96,17 +64,19 @@ jobs:
         with:
           persist-credentials: false
 
-      - name: Setup Node with shared dependencies
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
-          node-modules-cache: true
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn install --immutable
 
       - name: Build e2e test app
-        uses: ./.github/actions/build
-        with:
-          target: build-e2e-test-app-e2e
-          github-token: ${{ secrets.GITHUB_TOKEN }}
-          is-test: true
+        run: ./node_modules/.bin/gulp build-e2e-test-app
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Upload e2e test app build
         uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
@@ -119,7 +89,6 @@ jobs:
   # ── Build the gallery and share it via artifact ─────────────────────────────
   build-gallery:
     name: Build gallery
-    needs: prepare-dependencies
     runs-on: ubuntu-latest
     steps:
       - name: Check out files from GitHub
@@ -127,16 +96,19 @@ jobs:
         with:
           persist-credentials: false
 
-      - name: Setup Node with shared dependencies
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
-          node-modules-cache: true
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn install --immutable
 
       - name: Build gallery
-        uses: ./.github/actions/build
-        with:
-          target: build-gallery
-          github-token: ${{ secrets.GITHUB_TOKEN }}
+        run: ./node_modules/.bin/gulp build-gallery
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Upload gallery build
         uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
@@ -146,39 +118,41 @@ jobs:
           if-no-files-found: error
           retention-days: 3
 
-  # ── Run Playwright tests against Chromium ──────────────────────────────────
-  e2e-demo:
-    name: E2E demo (${{ matrix.shardIndex }}/${{ matrix.shardTotal }})
-    needs:
-      - build-demo
-      - prepare-container-dependencies
+  # ── Run Playwright tests locally against Chromium ──────────────────────────
+  e2e-local:
+    name: E2E (local Chromium)
+    needs: [build-demo, build-e2e-test-app, build-gallery]
     runs-on: ubuntu-latest
-    container:
-      image: mcr.microsoft.com/playwright:v1.61.1-noble
-      options: --user 1001 --ipc=host
-    defaults:
-      run:
-        shell: bash
-    timeout-minutes: 20
-    strategy:
-      fail-fast: false
-      matrix:
-        shardIndex:
-          - 1
-          - 2
-        shardTotal:
-          - 2
+    # Fail fast if anything hangs. The whole suite should take < 15 minutes on
+    # Chromium; anything longer is almost certainly an install or webServer
+    # hang.
+    timeout-minutes: 30
     steps:
       - name: Check out files from GitHub
         uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
         with:
           persist-credentials: false
 
-      - name: Setup Node with shared dependencies
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
-          node-modules-cache: true
-          node-modules-cache-key: node-modules-container-v1
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn install --immutable
+
+      # Cache the downloaded browser build keyed on the pinned Playwright
+      # version (yarn.lock), so re-runs skip the ~170 MB download.
+      - name: Cache Playwright browsers
+        uses: actions/cache@27d5ce7f107fe9357f9df03efb73ab90386fccae # v5.0.5
+        with:
+          path: ~/.cache/ms-playwright
+          key: ${{ runner.os }}-playwright-${{ hashFiles('yarn.lock') }}
+
+      - name: Install Playwright browsers
+        run: yarn playwright install --with-deps chromium
+        timeout-minutes: 10
 
       - name: Download demo build
         uses: actions/download-artifact@3e5f45b2cfb9172054b4087a40e8e0b5a5461e7c # v8.0.1
@@ -186,135 +160,36 @@ jobs:
           name: demo-dist
           path: demo/dist/
 
-      - name: Run Playwright demo tests
-        run: yarn test:e2e:demo --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }}
-        timeout-minutes: 15
-
-      - name: Upload demo blob report
-        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
-        if: always()
-        with:
-          name: blob-report-demo-${{ matrix.shardIndex }}
-          path: test/e2e/reports/demo/
-          if-no-files-found: warn
-          retention-days: 3
-
-  e2e-app:
-    name: E2E app (${{ matrix.shardIndex }}/${{ matrix.shardTotal }})
-    needs:
-      - build-e2e-test-app
-      - prepare-container-dependencies
-    runs-on: ubuntu-latest
-    container:
-      image: mcr.microsoft.com/playwright:v1.61.1-noble
-      options: --user 1001 --ipc=host
-    defaults:
-      run:
-        shell: bash
-    timeout-minutes: 20
-    strategy:
-      fail-fast: false
-      matrix:
-        shardIndex:
-          - 1
-          - 2
-          - 3
-          - 4
-        shardTotal:
-          - 4
-    steps:
-      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
-        with:
-          persist-credentials: false
-
-      - name: Setup Node with shared dependencies
-        uses: ./.github/actions/setup
-        with:
-          node-modules-cache: true
-          node-modules-cache-key: node-modules-container-v1
-
       - name: Download e2e test app build
         uses: actions/download-artifact@3e5f45b2cfb9172054b4087a40e8e0b5a5461e7c # v8.0.1
         with:
           name: e2e-test-app-dist
           path: test/e2e/app/dist/
 
-      - name: Run Playwright app tests
-        run: yarn test:e2e:app --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }}
-        timeout-minutes: 15
-
-      - name: Upload app blob report
-        uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
-        if: always()
-        with:
-          name: blob-report-app-${{ matrix.shardIndex }}
-          path: test/e2e/reports/app/
-          if-no-files-found: warn
-          retention-days: 3
-
-  e2e-gallery:
-    name: E2E gallery (${{ matrix.shardIndex }}/${{ matrix.shardTotal }})
-    needs:
-      - build-gallery
-      - prepare-container-dependencies
-    runs-on: ubuntu-latest
-    container:
-      image: mcr.microsoft.com/playwright:v1.61.1-noble
-      options: --user 1001 --ipc=host
-    defaults:
-      run:
-        shell: bash
-    timeout-minutes: 20
-    strategy:
-      fail-fast: false
-      matrix:
-        shardIndex:
-          - 1
-          - 2
-          - 3
-          - 4
-        shardTotal:
-          - 4
-    steps:
-      - name: Check out files from GitHub
-        uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
-        with:
-          persist-credentials: false
-
-      - name: Setup Node with shared dependencies
-        uses: ./.github/actions/setup
-        with:
-          node-modules-cache: true
-          node-modules-cache-key: node-modules-container-v1
-
       - name: Download gallery build
         uses: actions/download-artifact@3e5f45b2cfb9172054b4087a40e8e0b5a5461e7c # v8.0.1
         with:
           name: gallery-dist
           path: gallery/dist/
 
-      - name: Run Playwright gallery tests
-        run: yarn test:e2e:gallery --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }}
+      - name: Run Playwright tests (local)
+        run: yarn test:e2e
         timeout-minutes: 15
 
-      - name: Upload gallery blob report
+      - name: Upload blob report
         uses: actions/upload-artifact@043fb46d1a93c77aae656e7c1c64a875d1fc6a0a # v7.0.1
         if: always()
         with:
-          name: blob-report-gallery-${{ matrix.shardIndex }}
-          path: test/e2e/reports/gallery/
-          if-no-files-found: warn
+          name: blob-report-local
+          path: test/e2e/reports/
           retention-days: 3
 
+  # ── Merge local blob reports and post PR comment ───────────────────────────
   report:
     name: Report
-    needs:
-      - e2e-demo
-      - e2e-app
-      - e2e-gallery
+    needs: [e2e-local]
     runs-on: ubuntu-latest
-    if: ${{ always() }}
+    if: ${{ !cancelled() }}
     permissions:
       contents: read
       pull-requests: write
@@ -324,31 +199,21 @@ jobs:
         with:
           persist-credentials: false
 
-      - name: Setup Node with shared dependencies
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
-          node-modules-cache: true
+          node-version-file: ".nvmrc"
+          cache: yarn
 
-      - name: Download demo blob reports
+      - name: Install dependencies
+        run: yarn install --immutable
+
+      - name: Download blob report (local)
         uses: actions/download-artifact@3e5f45b2cfb9172054b4087a40e8e0b5a5461e7c # v8.0.1
         continue-on-error: true
         with:
-          pattern: blob-report-demo-*
-          path: test/e2e/reports/demo/
-
-      - name: Download app blob reports
-        uses: actions/download-artifact@3e5f45b2cfb9172054b4087a40e8e0b5a5461e7c # v8.0.1
-        continue-on-error: true
-        with:
-          pattern: blob-report-app-*
-          path: test/e2e/reports/app/
-
-      - name: Download gallery blob reports
-        uses: actions/download-artifact@3e5f45b2cfb9172054b4087a40e8e0b5a5461e7c # v8.0.1
-        continue-on-error: true
-        with:
-          pattern: blob-report-gallery-*
-          path: test/e2e/reports/gallery/
+          name: blob-report-local
+          path: test/e2e/reports/
 
       - name: Stage blobs for merge
         run: node test/e2e/collect-blob-reports.mjs
@@ -365,11 +230,7 @@ jobs:
           retention-days: 14
 
       - name: Post report to PR
-        if: >-
-          github.event_name == 'pull_request' &&
-          (needs.e2e-demo.result == 'failure' ||
-          needs.e2e-app.result == 'failure' ||
-          needs.e2e-gallery.result == 'failure')
+        if: github.event_name == 'pull_request' && needs.e2e-local.result == 'failure'
         uses: actions/github-script@3a2844b7e9c422d3c10d287c895573f7108da1b3 # v9.0.0
         with:
           script: |
@@ -377,19 +238,3 @@ jobs:
               `${process.env.GITHUB_WORKSPACE}/test/e2e/post-report-comment.mjs`
             );
             await postReportComment({ github, context, core });
-
-      - name: Check suite results
-        run: |
-          failed=0
-          for suite in \
-            "demo:${{ needs.e2e-demo.result }}" \
-            "app:${{ needs.e2e-app.result }}" \
-            "gallery:${{ needs.e2e-gallery.result }}"; do
-            name="${suite%%:*}"
-            result="${suite#*:}"
-            echo "E2E ${name}: ${result}"
-            if [ "$result" != "success" ]; then
-              failed=1
-            fi
-          done
-          exit "$failed"

.github/workflows/labeler.yaml

@@ -10,6 +10,6 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Apply labels
-        uses: actions/labeler@b8dd2d9be0f68b860e7dae5dae7d772984eacd6d # v6.2.0
+        uses: actions/labeler@f27b608878404679385c85cfa523b85ccb86e213 # v6.1.0
         with:
           sync-labels: true

.github/workflows/nightly.yaml

@@ -25,14 +25,18 @@ jobs:
           persist-credentials: false
 
       - name: Set up Python ${{ env.PYTHON_VERSION }}
-        uses: actions/setup-python@ece7cb06caefa5fff74198d8649806c4678c61a1 # v6
+        uses: actions/setup-python@a309ff8b426b58ec0e2a45f0f869d46889d02405 # v6
         with:
           python-version: ${{ env.PYTHON_VERSION }}
 
-      - name: Setup Node and install
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
-          immutable: false
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn install
 
       - name: Download translations
         run: ./script/translations_download

.github/workflows/release-drafter.yaml

@@ -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@ed4bc48ec97379be2258e7b7ac2624a3e26ab809 # v7.4.0
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/release.yaml

@@ -31,18 +31,20 @@ jobs:
           persist-credentials: false
 
       - name: Set up Python ${{ env.PYTHON_VERSION }}
-        uses: actions/setup-python@ece7cb06caefa5fff74198d8649806c4678c61a1 # v6.3.0
+        uses: actions/setup-python@a309ff8b426b58ec0e2a45f0f869d46889d02405 # v6.2.0
         with:
           python-version: ${{ env.PYTHON_VERSION }}
 
       - name: Verify version
         uses: home-assistant/actions/helpers/verify-version@f4ca6f671bd429efb108c0f2fa0ae8af0215986c # master
 
-      - name: Setup Node and install
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
-          immutable: false
-          cache: false
+          node-version-file: ".nvmrc"
+
+      - name: Install dependencies
+        run: yarn install
 
       - name: Download Translations
         run: ./script/translations_download
@@ -95,7 +97,7 @@ jobs:
 
       # home-assistant/wheels doesn't support SHA pinning
       - name: Build wheels
-        uses: home-assistant/wheels@9e17ab1ed5c4c79d8b61e29fa63de25ca2710716 # 2026.07.0
+        uses: home-assistant/wheels@34957438948e0b3dcde73c77750643dadae594f5 # 2026.06.0
         with:
           abi: cp314
           tag: musllinux_1_2
@@ -114,11 +116,12 @@ jobs:
         uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
         with:
           persist-credentials: false
-      - name: Setup Node and install
-        uses: ./.github/actions/setup
+      - name: Setup Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
         with:
-          immutable: false
-          cache: false
+          node-version-file: ".nvmrc"
+      - name: Install dependencies
+        run: yarn install
       - name: Download Translations
         run: ./script/translations_download
         env:

.github/workflows/stale.yml

@@ -15,7 +15,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: 90 days stale policy
-        uses: actions/stale@1e223db275d687790206a7acac4d1a11bd6fe629 # v10.4.0
+        uses: actions/stale@eb5cf3af3ac0a1aa4c9c45633dd1ae542a27a899 # v10.3.0
         with:
           repo-token: ${{ secrets.GITHUB_TOKEN }}
           days-before-stale: 90

.github/workflows/sync-numeric-device-classes.yaml

@@ -22,11 +22,15 @@ jobs:
     steps:
       - name: Checkout the repository
         uses: actions/checkout@9c091bb21b7c1c1d1991bb908d89e4e9dddfe3e0 # v7.0.0
-        with:
-          persist-credentials: false
 
-      - name: Setup Node and install
-        uses: ./.github/actions/setup
+      - name: Set up Node
+        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6.4.0
+        with:
+          node-version-file: ".nvmrc"
+          cache: yarn
+
+      - name: Install dependencies
+        run: yarn install --immutable
 
       - name: Regenerate numeric device classes
         run: ./script/gen_numeric_device_classes

.github/workflows/translations.yaml

@@ -6,7 +6,6 @@ on:
     branches:
       - dev
     paths:
-      - .github/workflows/translations.yaml
       - src/translations/en.json
 
 permissions:
@@ -23,6 +22,6 @@ jobs:
           persist-credentials: false
 
       - name: Upload Translations
-        run: ./script/translations_upload_base
-        env:
-          LOKALISE_TOKEN: ${{ secrets.LOKALISE_TOKEN }}
+        run: |
+          export LOKALISE_TOKEN="${{ secrets.LOKALISE_TOKEN }}"
+          ./script/translations_upload_base

.gitignore

@@ -6,8 +6,6 @@ build/
 dist/
 /hass_frontend/
 /translations/
-# Composite action source, not build output
-!/.github/actions/build/
 
 # yarn
 .yarn/*
@@ -61,12 +59,9 @@ test/e2e/reports/
 test/e2e/test-results/
 # E2E test app build output
 test/e2e/app/dist/
-# MCP server
-.playwright-mcp/
 
 # AI tooling
-.claude/*
-!.claude/skills
+.claude
 .cursor
 .opencode
 .serena

.yarnrc.yml

@@ -13,4 +13,4 @@ nodeLinker: node-modules
 
 npmMinimalAgeGate: 3d
 
-yarnPath: .yarn/releases/yarn-4.17.1.cjs
+yarnPath: .yarn/releases/yarn-4.17.0.cjs

AGENTS.md

@@ -1,60 +0,0 @@
-# Home Assistant Frontend Agent Guide
-
-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 gallery-specific documentation, demos, page structure, and examples, read `gallery/AGENTS.md` when working under `gallery/`.
-
-## Essential Commands
-
-```bash
-yarn lint          # ESLint + Prettier + TypeScript + Lit
-yarn format        # Auto-fix ESLint + Prettier
-yarn lint:types    # TypeScript compiler, run without file arguments
-yarn test          # Vitest
-yarn dev           # App dev server, supports --background/--status/--stop/--logs
-yarn dev:serve     # Local serving dev server, supports -c core URL, -p port, and dev flags
-```
-
-Never run `tsc` or `yarn lint:types` with file arguments. When `tsc` receives file arguments, it ignores `tsconfig.json` and can emit `.js` files into `src/`. Always run `yarn lint:types` without arguments. For individual file type checking, rely on editor diagnostics.
-
-## Architecture
-
-- The frontend uses custom elements built with Lit and TypeScript strict mode.
-- Components communicate with the backend through the Home Assistant WebSocket API.
-- Use `ha-` for Home Assistant components, `hui-` for Lovelace UI components, and `dialog-` for dialogs.
-- Prefer `ha-*` components and current Web Awesome wrappers. Avoid adding new legacy `mwc-*` usage.
-- Leaf components should consume narrow Lit contexts instead of taking the broad `hass` object unless they are containers that own and provide `hass`.
-
-## Development Standards
-
-- Use strict TypeScript, proper interfaces, and `import type` for type-only imports.
-- Avoid `any`; model data with existing Home Assistant types or narrow new types.
-- Keep imports organized and remove unused imports.
-- Do not use `console`; use existing logging or user-visible error patterns.
-- Use `@state()` for internal Lit state and `@property()` for public API.
-- Do not query or manipulate DOM manually when Lit decorators, component refs, or render state are appropriate.
-- Scope styles to components, use theme custom properties, and keep layouts mobile-first and RTL-safe.
-- All user-facing text must be localized through the translation system.
-
-## Project Skills
-
-Detailed guidance lives in project skills under `.agents/skills/`. Load the matching skill before detailed implementation or review:
-
-- `ha-frontend-contexts`: Lit contexts, `hass` migration, and rerender-sensitive state access.
-- `ha-frontend-components`: dialogs, forms, alerts, shortcuts, tooltips, panels, and Lovelace cards.
-- `ha-frontend-styling`: theme variables, spacing tokens, responsive layout, RTL, and view transitions.
-- `ha-frontend-testing`: lint, typecheck, Vitest, Playwright e2e dev servers, and benchmarks.
-- `ha-frontend-user-facing-text`: localization, terminology, sentence case, and Home Assistant text style.
-- `ha-frontend-review`: PR template use, review checklist, and recurring review issues.
-
-## Pull Requests
-
-When creating a pull request, use `.github/PULL_REQUEST_TEMPLATE.md` as the PR body. Preserve template sections, check only the appropriate type-of-change boxes, and do not check checklist items on behalf of the user. If the PR includes UI changes, remind the user to add screenshots or a short video.
-
-## AI policy
-
-This project follows the [Open Home Foundation AI Policy](AI_POLICY.md).
-Autonomous contributions are not accepted: a human must review, understand,
-and be able to explain every change before it is submitted. Do not open
-issues or pull requests autonomously, and do not post comments on behalf of
-a user without their review.

AGENTS.md

@@ -0,0 +1 @@
+.github/copilot-instructions.md

AI_POLICY.md

@@ -1,45 +0,0 @@
-# Open Home Foundation - AI Policy
-
-We support using AI (i.e., LLMs) as tools when contributing to Open Home Foundation projects. However, you are responsible for any contributions you submit, and we are responsible for any contributions we merge and release. We hold a high bar for all contributions to our projects.
-
-Our maintainers dedicate their time and expertise to reviewing contributions. Submitting AI-generated content that you have not personally reviewed and understood wastes that time and will not be accepted.
-
-## Autonomous agents
-
-**We do not allow autonomous agents to be used for contributing to our projects.** We will close any pull requests or issues that we believe were created autonomously, and may mark automated comments as spam. This includes contributions that bypass the provided issue or pull request templates.
-
-## Communication on issues, pull requests, and code reviews
-
-We don't mind if you use AI tools to help you write. However, do not have tools post unreviewed content on your behalf. Keep responses to the minimum needed to communicate your intent. We may hide any comments that we believe are unreviewed AI output.
-
-If you are opening a pull request, we expect you to be able to explain the proposed changes in your own words. This includes the pull request description and responses to questions. If you use AI to help generate the pull request summary, you must review it for technical accuracy.
-
-**Do not use AI to generate answers to questions from maintainers.** You should understand and be able to explain your own work. Using AI to improve grammar or clarity is fine, but the substance of your responses must be your own.
-
-If you wish to include context from an interaction with AI in your comments, it must be in a quote block (e.g., using `>`) and disclosed as such. It must be accompanied by your own commentary explaining the relevance and implications of the context. Do not share long snippets.
-
-## Non-native English speakers
-
-We understand that AI is useful when communicating as a non-native English speaker. Using AI to improve the grammar or clarity of text you have written yourself is fine. If you are using AI to translate your comments, please ensure the translation accurately reflects your intent. Including your original text in a details block shows the effort behind your contribution, helps maintainers verify the translation if needed, and keeps the conversation readable.
-
-## Code and documentation contributions
-
-AI can be a helpful tool for writing code and documentation. However, due to the foundational open source nature of our projects, we require a human in the loop who understands the work produced by AI.
-
-All contributions must be reviewed and understood by the contributor before submission. You should be able to explain every change in a pull request you submit. Pull requests that appear to be unreviewed AI output will be closed without review.
-
-## Our use of AI
-
-Some of our projects use AI tools to assist with code reviews, issue triaging, reporting, and other project management tasks. These tools may leave comments on pull requests or issues. As with any automated tooling, these comments are not always correct.
-
-If an AI tool leaves a comment on your contribution, treat it as you would any other review comment. If you believe it is incorrect, say so; a brief explanation is sufficient. Maintainers always have the final say. If in doubt, ask a maintainer.
-
-## Enforcement
-
-Contributions that do not follow this policy will be closed. Repeated violations may result in being blocked from contributing to OHF projects. If you believe your contribution was closed in error, you are welcome to reach out to a maintainer to discuss.
-
----
-
-The canonical version of this policy is published at
-<https://developers.home-assistant.io/docs/ai_policy>. In case of differences,
-the published version applies.

CLAUDE.md

@@ -1 +1 @@
-AGENTS.md
+.github/copilot-instructions.md

build-scripts/bundle.cjs

@@ -232,7 +232,7 @@ module.exports.config = {
     };
   },
 
-  demo({ isProdBuild, latestBuild, isStatsBuild, isTestBuild }) {
+  demo({ isProdBuild, latestBuild, isStatsBuild }) {
     return {
       name: "demo" + nameSuffix(latestBuild),
       entry: {
@@ -247,7 +247,6 @@ module.exports.config = {
       isProdBuild,
       latestBuild,
       isStatsBuild,
-      isTestBuild,
     };
   },
 
@@ -307,7 +306,7 @@ module.exports.config = {
     };
   },
 
-  e2eTestApp({ isProdBuild, latestBuild, isStatsBuild, isTestBuild }) {
+  e2eTestApp({ isProdBuild, latestBuild, isStatsBuild }) {
     return {
       name: "e2e-test-app" + nameSuffix(latestBuild),
       entry: {
@@ -322,7 +321,6 @@ module.exports.config = {
       isProdBuild,
       latestBuild,
       isStatsBuild,
-      isTestBuild,
     };
   },
 };

build-scripts/dev-server.mjs

@@ -1,678 +0,0 @@
-// Manage a Home Assistant frontend dev server with an agent-friendly interface.
-//
-//   node build-scripts/dev-server.mjs --suite <suite> [mode] [extra args]
-//
-//   (no mode)          Run in the foreground.
-//   --background       Start detached, wait until it is ready, print the URL
-//                      (when it has one) and pid, then exit and leave it running.
-//   --status           Report whether the suite's dev server is running.
-//   --stop             Stop a running background dev server.
-//   --logs [--follow]  Print (or follow) the background dev server log.
-//
-// Extra args (for example -p or -c on app-serve) are forwarded to the underlying
-// script. Suites use one of two liveness models:
-//
-//   health   demo, gallery, e2e-app: a fixed port plus the /__ha_dev_status
-//            endpoint each dev server exposes (see runDevServer in
-//            build-scripts/gulp/rspack.js). The port is the source of truth and
-//            the pid is found from it; no state file.
-//   process  app (yarn dev) and app-serve (yarn dev:serve): the app watcher has
-//            no health endpoint, and plain yarn dev has no port at all, so these
-//            track a pidfile and treat the first "Build done" log line as ready.
-
-import { spawn, execFileSync } from "node:child_process";
-import fs from "node:fs";
-import path from "node:path";
-import { fileURLToPath } from "node:url";
-
-const repoRoot = path.resolve(
-  path.dirname(fileURLToPath(import.meta.url)),
-  ".."
-);
-const gulpBin = path.join(repoRoot, "node_modules", ".bin", "gulp");
-const developAndServeScript = path.join(
-  repoRoot,
-  "script",
-  "develop_and_serve"
-);
-const logDir = path.join(repoRoot, "node_modules", ".cache", "ha-dev-server");
-
-// Each suite names its yarn alias (for hints), a liveness model, and how to
-// spawn it. health suites carry a fixed port; process suites carry the log line
-// that means "ready" and, for app-serve, forward extra args to the script.
-const SUITES = {
-  "e2e-app": {
-    alias: "test:e2e:app:dev",
-    liveness: "health",
-    port: 8095,
-    spawn: { cmd: gulpBin, args: ["develop-e2e-test-app"] },
-  },
-  demo: {
-    alias: "dev:demo",
-    liveness: "health",
-    port: 8090,
-    spawn: { cmd: gulpBin, args: ["develop-demo"] },
-  },
-  gallery: {
-    alias: "dev:gallery",
-    liveness: "health",
-    port: 8100,
-    spawn: { cmd: gulpBin, args: ["develop-gallery"] },
-  },
-  app: {
-    alias: "dev",
-    liveness: "process",
-    readyLog: /Build done @/,
-    spawn: { cmd: gulpBin, args: ["develop-app"] },
-  },
-  "app-serve": {
-    alias: "dev:serve",
-    liveness: "process",
-    acceptsArgs: true,
-    readyLog: /Build done @/,
-    spawn: { cmd: developAndServeScript, args: [] },
-  },
-};
-
-// Cover a cold build on a slow machine before the server starts listening.
-// Override with HA_DEV_SERVER_TIMEOUT (seconds).
-const READY_TIMEOUT_MS =
-  Number(process.env.HA_DEV_SERVER_TIMEOUT || "180") * 1000;
-
-// Detect a coding agent from a small set of environment markers set by common
-// agent CLIs (env-only; no process-ancestry detection).
-const detectAgent = () => {
-  const env = process.env;
-  const has = (name) => Boolean(env[name]);
-  const eq = (name, value) => env[name] === value;
-  const signals = {
-    opencode: () =>
-      [
-        "OPENCODE",
-        "OPENCODE_BIN_PATH",
-        "OPENCODE_SERVER",
-        "OPENCODE_APP_INFO",
-      ].some(has),
-    "claude-code": () => has("CLAUDECODE"),
-    cursor: () => has("CURSOR_TRACE_ID"),
-    "github-copilot": () =>
-      eq("TERM_PROGRAM", "vscode") && eq("GIT_PAGER", "cat"),
-    // Convention shared by several agents (Crush, Amp, ...).
-    generic: () => has("AGENT") || has("AI_AGENT"),
-  };
-  return Object.keys(signals).find((id) => signals[id]());
-};
-
-const usage = () => {
-  const suites = Object.keys(SUITES).join("|");
-  process.stderr.write(
-    `Usage: node build-scripts/dev-server.mjs --suite <${suites}> ` +
-      `[--background | --status | --stop | --logs [--follow]]\n`
-  );
-};
-
-const parseArgs = (argv) => {
-  const args = {
-    mode: "foreground",
-    follow: false,
-    suite: undefined,
-    passthrough: [],
-  };
-  for (let i = 0; i < argv.length; i++) {
-    const arg = argv[i];
-    switch (arg) {
-      case "--suite":
-        args.suite = argv[++i];
-        break;
-      case "--background":
-        args.mode = "background";
-        break;
-      case "--status":
-        args.mode = "status";
-        break;
-      case "--stop":
-        args.mode = "stop";
-        break;
-      case "--logs":
-        args.mode = "logs";
-        break;
-      case "--follow":
-        args.follow = true;
-        break;
-      default:
-        // Anything unrecognised is forwarded to the underlying script.
-        args.passthrough.push(arg);
-    }
-  }
-  return args;
-};
-
-const sleep = (ms) =>
-  new Promise((resolve) => {
-    setTimeout(resolve, ms);
-  });
-
-const logFileFor = (suite) => path.join(logDir, `${suite}.log`);
-const pidFileFor = (suite) => path.join(logDir, `${suite}.pid`);
-
-const hints = (suite) => {
-  const alias = `yarn ${SUITES[suite].alias}`;
-  return (
-    `  Stop:   ${alias} --stop\n` +
-    `  Status: ${alias} --status\n` +
-    `  Logs:   ${alias} --logs\n`
-  );
-};
-
-// --- shared spawning and lifecycle ------------------------------------------
-
-// Signal the whole process group (the background server is its group leader),
-// falling back to the bare pid if that is not permitted.
-const killProcessTree = (pid, sig) => {
-  try {
-    process.kill(-pid, sig);
-  } catch {
-    try {
-      process.kill(pid, sig);
-    } catch {
-      // Already gone.
-    }
-  }
-};
-
-const urlSuffix = (port) => (port ? ` at http://localhost:${port}` : "");
-
-// Run a server in the foreground, inheriting stdio; resolve with its exit code.
-const spawnInherit = (cmd, args) =>
-  new Promise((resolve) => {
-    const child = spawn(cmd, args, { cwd: repoRoot, stdio: "inherit" });
-    child.on("exit", (code) => resolve(code ?? 0));
-  });
-
-// Spawn a detached server that writes stdout and stderr to the suite's log file.
-const spawnDetachedToLog = (suite, cmd, args) => {
-  fs.mkdirSync(logDir, { recursive: true });
-  const logFile = logFileFor(suite);
-  const fd = fs.openSync(logFile, "w");
-  const child = spawn(cmd, args, {
-    cwd: repoRoot,
-    detached: true,
-    stdio: ["ignore", fd, fd],
-  });
-  fs.closeSync(fd);
-  child.unref();
-  return { child, logFile };
-};
-
-// Poll until the server is ready, the child exits, or we time out. Prints the
-// progress dots and outcome; returns 0 when ready, 1 otherwise. onExit runs if
-// the child dies before it is ready (used to clear a stale pidfile).
-const awaitReady = async ({ suite, child, logFile, port, isReady, onExit }) => {
-  let childExited = false;
-  child.on("exit", () => {
-    childExited = true;
-  });
-  const deadline = Date.now() + READY_TIMEOUT_MS;
-  process.stdout.write(`Starting ${suite} dev server`);
-  /* eslint-disable no-await-in-loop -- poll until the server is ready */
-  while (Date.now() < deadline) {
-    if (childExited) {
-      process.stdout.write("\n");
-      process.stderr.write(
-        `Dev server (${suite}) exited before it was ready. See ${logFile}\n`
-      );
-      onExit?.();
-      return 1;
-    }
-    if (await isReady()) {
-      process.stdout.write("\n");
-      process.stdout.write(
-        `Dev server (${suite}) running${urlSuffix(port)} ` +
-          `(pid ${child.pid})\n${hints(suite)}`
-      );
-      return 0;
-    }
-    process.stdout.write(".");
-    await sleep(1000);
-  }
-  /* eslint-enable no-await-in-loop */
-  process.stdout.write("\n");
-  process.stderr.write(
-    `Dev server (${suite}) did not become ready within ${
-      READY_TIMEOUT_MS / 1000
-    }s. See ${logFile}\n`
-  );
-  return 1;
-};
-
-// Stop a running background server: SIGTERM, wait for it to go, then SIGKILL.
-// isStopped reports when it is gone; onStopped runs on success (pidfile cleanup).
-const terminate = async (suite, pid, isStopped, onStopped) => {
-  killProcessTree(pid, "SIGTERM");
-  const deadline = Date.now() + 10_000;
-  /* eslint-disable no-await-in-loop -- poll until the server is gone */
-  while (Date.now() < deadline) {
-    await sleep(300);
-    if (await isStopped()) {
-      onStopped?.();
-      process.stdout.write(`Stopped dev server (${suite}) (pid ${pid}).\n`);
-      return 0;
-    }
-  }
-  /* eslint-enable no-await-in-loop */
-  // Escalate if it is still up.
-  killProcessTree(pid, "SIGKILL");
-  await sleep(300);
-  if (!(await isStopped())) {
-    process.stderr.write(
-      `Failed to stop dev server (${suite}) (pid ${pid}). Stop it manually.\n`
-    );
-    return 1;
-  }
-  onStopped?.();
-  process.stdout.write(`Stopped dev server (${suite}) (pid ${pid}).\n`);
-  return 0;
-};
-
-// --- health liveness (port + /__ha_dev_status) ------------------------------
-
-/**
- * Probe the health endpoint. Dev servers bind IPv4 or IPv6 localhost depending
- * on the OS, so try each; the port is "free" only if every address refuses.
- * @returns {Promise<{state: "ours" | "foreign" | "free", suite?: string}>}
- */
-const PROBE_HOSTS = ["localhost", "127.0.0.1", "[::1]"];
-
-const probe = async (port, timeoutMs = 1000) => {
-  let sawResponse = false;
-  /* eslint-disable no-await-in-loop -- probe localhost addresses in order, stopping at the first that answers */
-  for (const host of PROBE_HOSTS) {
-    const controller = new AbortController();
-    const timer = setTimeout(() => controller.abort(), timeoutMs);
-    try {
-      const res = await fetch(`http://${host}:${port}/__ha_dev_status`, {
-        signal: controller.signal,
-      });
-      sawResponse = true;
-      if (res.ok) {
-        const body = await res.json().catch(() => null);
-        if (body && body.server === "ha-frontend-dev") {
-          return { state: "ours", suite: body.suite };
-        }
-      }
-    } catch {
-      // Try the next address.
-    } finally {
-      clearTimeout(timer);
-    }
-  }
-  /* eslint-enable no-await-in-loop */
-  return sawResponse ? { state: "foreign" } : { state: "free" };
-};
-
-// Find the pid listening on a port via the first available tool (no state file).
-const pidFromPort = (port) => {
-  const attempts = [
-    [
-      "lsof",
-      ["-ti", `tcp:${port}`, "-sTCP:LISTEN"],
-      (out) => out.trim().split("\n")[0],
-    ],
-    [
-      "ss",
-      ["-ltnpH", `sport = :${port}`],
-      (out) => out.match(/pid=(\d+)/)?.[1],
-    ],
-    ["fuser", [`${port}/tcp`], (out) => out.trim().split(/\s+/)[0]],
-  ];
-  for (const [cmd, cmdArgs, extract] of attempts) {
-    try {
-      const out = execFileSync(cmd, cmdArgs, {
-        encoding: "utf8",
-        stdio: ["ignore", "pipe", "ignore"],
-      });
-      const pid = Number(extract(out));
-      if (Number.isInteger(pid) && pid > 0) {
-        return pid;
-      }
-    } catch {
-      // Try the next tool.
-    }
-  }
-  return undefined;
-};
-
-const runForegroundHealth = async (suite, cfg) => {
-  const { port } = cfg;
-  const status = await probe(port);
-  if (status.state === "ours" && status.suite === suite) {
-    process.stdout.write(
-      `Dev server (${suite}) is already running at http://localhost:${port}\n`
-    );
-    return 0;
-  }
-  if (status.state === "foreign") {
-    process.stderr.write(
-      `Port ${port} is in use by another process; not the ${suite} dev server.\n`
-    );
-    return 1;
-  }
-  return spawnInherit(cfg.spawn.cmd, cfg.spawn.args);
-};
-
-const runBackgroundHealth = async (suite, cfg) => {
-  const { port } = cfg;
-  const preflight = await probe(port);
-  if (preflight.state === "ours" && preflight.suite === suite) {
-    const pid = pidFromPort(port);
-    process.stdout.write(
-      `Dev server (${suite}) already running at http://localhost:${port}` +
-        `${pid ? ` (pid ${pid})` : ""}\n${hints(suite)}`
-    );
-    return 0;
-  }
-  if (preflight.state === "foreign") {
-    process.stderr.write(
-      `Port ${port} is in use by another process; not the ${suite} dev server.\n`
-    );
-    return 1;
-  }
-
-  const { child, logFile } = spawnDetachedToLog(
-    suite,
-    cfg.spawn.cmd,
-    cfg.spawn.args
-  );
-  return awaitReady({
-    suite,
-    child,
-    logFile,
-    port,
-    isReady: async () => {
-      const status = await probe(port, 1000);
-      return status.state === "ours" && status.suite === suite;
-    },
-  });
-};
-
-const runStatusHealth = async (suite, cfg) => {
-  const { port } = cfg;
-  const status = await probe(port);
-  if (status.state === "ours" && status.suite === suite) {
-    const pid = pidFromPort(port);
-    process.stdout.write(
-      `Dev server (${suite}) running at http://localhost:${port}` +
-        `${pid ? ` (pid ${pid})` : ""}\n`
-    );
-  } else if (status.state === "ours") {
-    process.stdout.write(
-      `Port ${port} is serving a different Home Assistant frontend dev server (suite ${status.suite ?? "unknown"}); not ${suite}.\n`
-    );
-  } else if (status.state === "foreign") {
-    process.stdout.write(
-      `Port ${port} is in use by another process; not the ${suite} dev server.\n`
-    );
-  } else {
-    process.stdout.write(`Dev server (${suite}) not running.\n`);
-  }
-  return 0;
-};
-
-const runStopHealth = async (suite, cfg) => {
-  const { port } = cfg;
-  const status = await probe(port);
-  if (!(status.state === "ours" && status.suite === suite)) {
-    // Idempotent: stopping something that is not running is a success.
-    process.stdout.write(`Dev server (${suite}) not running.\n`);
-    return 0;
-  }
-  const pid = pidFromPort(port);
-  if (!pid) {
-    process.stderr.write(
-      `Dev server (${suite}) is running but its pid could not be found ` +
-        `(no lsof/ss/fuser?). Stop it manually.\n`
-    );
-    return 1;
-  }
-  return terminate(
-    suite,
-    pid,
-    async () => (await probe(port, 800)).state === "free"
-  );
-};
-
-// --- process liveness (pidfile + log-readiness) -----------------------------
-
-const isAlive = (pid) => {
-  if (!Number.isInteger(pid) || pid <= 0) {
-    return false;
-  }
-  try {
-    process.kill(pid, 0);
-    return true;
-  } catch (err) {
-    // EPERM means the process exists but is owned by someone else.
-    return err.code === "EPERM";
-  }
-};
-
-const readPidFile = (suite) => {
-  try {
-    const data = JSON.parse(fs.readFileSync(pidFileFor(suite), "utf8"));
-    if (data && Number.isInteger(data.pid)) {
-      return data;
-    }
-  } catch {
-    // Missing or corrupt.
-  }
-  return undefined;
-};
-
-const writePidFile = (suite, data) => {
-  fs.mkdirSync(logDir, { recursive: true });
-  fs.writeFileSync(pidFileFor(suite), JSON.stringify(data));
-};
-
-const removePidFile = (suite) => {
-  try {
-    fs.rmSync(pidFileFor(suite));
-  } catch {
-    // Already gone.
-  }
-};
-
-const logIsReady = (logFile, readyLog) => {
-  try {
-    return readyLog.test(fs.readFileSync(logFile, "utf8"));
-  } catch {
-    return false;
-  }
-};
-
-// app-serve serves on 8124 by default (8123 in a devcontainer), or whatever -p
-// the caller passed. Used only to show a URL; liveness comes from the pidfile.
-const resolveServePort = (passthrough) => {
-  const i = passthrough.indexOf("-p");
-  if (i !== -1) {
-    const port = Number(passthrough[i + 1]);
-    if (Number.isInteger(port) && port > 0) {
-      return port;
-    }
-  }
-  return process.env.DEVCONTAINER ? 8123 : 8124;
-};
-
-const spawnArgs = (cfg, passthrough) => [
-  ...cfg.spawn.args,
-  ...(cfg.acceptsArgs ? passthrough : []),
-];
-
-const runForegroundProcess = async (suite, cfg, passthrough) => {
-  const existing = readPidFile(suite);
-  if (existing && isAlive(existing.pid)) {
-    process.stdout.write(
-      `Dev server (${suite}) already running in the background ` +
-        `(pid ${existing.pid}). Stop it with yarn ${cfg.alias} --stop.\n`
-    );
-    return 0;
-  }
-  if (existing) {
-    removePidFile(suite);
-  }
-  return spawnInherit(cfg.spawn.cmd, spawnArgs(cfg, passthrough));
-};
-
-const runBackgroundProcess = async (suite, cfg, passthrough) => {
-  const existing = readPidFile(suite);
-  if (existing && isAlive(existing.pid)) {
-    process.stdout.write(
-      `Dev server (${suite}) already running${urlSuffix(existing.port)} ` +
-        `(pid ${existing.pid})\n${hints(suite)}`
-    );
-    return 0;
-  }
-  if (existing) {
-    removePidFile(suite);
-  }
-
-  const { child, logFile } = spawnDetachedToLog(
-    suite,
-    cfg.spawn.cmd,
-    spawnArgs(cfg, passthrough)
-  );
-
-  const port = cfg.acceptsArgs ? resolveServePort(passthrough) : cfg.port;
-  writePidFile(suite, { pid: child.pid, port });
-
-  return awaitReady({
-    suite,
-    child,
-    logFile,
-    port,
-    isReady: () => logIsReady(logFile, cfg.readyLog),
-    onExit: () => removePidFile(suite),
-  });
-};
-
-const runStatusProcess = async (suite) => {
-  const existing = readPidFile(suite);
-  if (existing && isAlive(existing.pid)) {
-    process.stdout.write(
-      `Dev server (${suite}) running${urlSuffix(existing.port)} ` +
-        `(pid ${existing.pid})\n`
-    );
-  } else {
-    if (existing) {
-      removePidFile(suite);
-    }
-    process.stdout.write(`Dev server (${suite}) not running.\n`);
-  }
-  return 0;
-};
-
-const runStopProcess = async (suite) => {
-  const existing = readPidFile(suite);
-  if (!existing || !isAlive(existing.pid)) {
-    // Idempotent: stopping something that is not running is a success.
-    if (existing) {
-      removePidFile(suite);
-    }
-    process.stdout.write(`Dev server (${suite}) not running.\n`);
-    return 0;
-  }
-  const { pid } = existing;
-  return terminate(
-    suite,
-    pid,
-    () => !isAlive(pid),
-    () => removePidFile(suite)
-  );
-};
-
-// --- shared -----------------------------------------------------------------
-
-const runLogs = (suite, follow) => {
-  const logFile = logFileFor(suite);
-  if (!fs.existsSync(logFile)) {
-    process.stdout.write(
-      `No log for the ${suite} dev server yet (${logFile}).\n`
-    );
-    return Promise.resolve(0);
-  }
-  if (!follow) {
-    process.stdout.write(fs.readFileSync(logFile, "utf8"));
-    return Promise.resolve(0);
-  }
-  return new Promise((resolve) => {
-    const tail = spawn("tail", ["-f", logFile], { stdio: "inherit" });
-    tail.on("error", () => {
-      // No tail available; fall back to a one-shot dump.
-      process.stdout.write(fs.readFileSync(logFile, "utf8"));
-      resolve(0);
-    });
-    tail.on("exit", (code) => resolve(code ?? 0));
-  });
-};
-
-const main = async () => {
-  const args = parseArgs(process.argv.slice(2));
-  const cfg = SUITES[args.suite];
-  if (!cfg) {
-    usage();
-    return 1;
-  }
-  if (args.passthrough.length && !cfg.acceptsArgs) {
-    process.stderr.write(
-      `Ignoring unexpected arguments: ${args.passthrough.join(" ")}\n`
-    );
-  }
-
-  // A plain dev:<suite> under a coding agent backgrounds itself; explicit modes
-  // are untouched.
-  let { mode } = args;
-  if (
-    mode === "foreground" &&
-    !["0", "false"].includes(process.env.HA_DEV_BACKGROUND)
-  ) {
-    const agent = detectAgent();
-    if (agent) {
-      process.stdout.write(
-        `Detected coding agent (${agent}); starting in the background. ` +
-          `Set HA_DEV_BACKGROUND=0 to force foreground.\n`
-      );
-      mode = "background";
-    }
-  }
-
-  const health = cfg.liveness === "health";
-  switch (mode) {
-    case "background":
-      return health
-        ? runBackgroundHealth(args.suite, cfg)
-        : runBackgroundProcess(args.suite, cfg, args.passthrough);
-    case "status":
-      return health
-        ? runStatusHealth(args.suite, cfg)
-        : runStatusProcess(args.suite);
-    case "stop":
-      return health
-        ? runStopHealth(args.suite, cfg)
-        : runStopProcess(args.suite);
-    case "logs":
-      return runLogs(args.suite, args.follow);
-    default:
-      return health
-        ? runForegroundHealth(args.suite, cfg)
-        : runForegroundProcess(args.suite, cfg, args.passthrough);
-  }
-};
-
-main().then(
-  (code) => {
-    process.exitCode = code;
-  },
-  (err) => {
-    process.stderr.write(`${err?.stack || err}\n`);
-    process.exitCode = 1;
-  }
-);

build-scripts/gulp/demo.js

@@ -42,22 +42,6 @@ gulp.task(
   )
 );
 
-gulp.task(
-  "build-demo-e2e",
-  gulp.series(
-    async function setEnv() {
-      process.env.NODE_ENV = "production";
-    },
-    "clean-demo",
-    // Cast needs to be backwards compatible and older HA has no translations
-    "translations-enable-merge-backend",
-    gulp.parallel("gen-icons-json", "build-translations", "build-locale-data"),
-    "copy-static-demo",
-    "rspack-prod-demo-e2e",
-    "gen-pages-demo-prod-e2e"
-  )
-);
-
 gulp.task(
   "analyze-demo",
   gulp.series(

build-scripts/gulp/e2e-test-app.js

@@ -39,18 +39,3 @@ gulp.task(
     "gen-pages-e2e-test-app-prod"
   )
 );
-
-gulp.task(
-  "build-e2e-test-app-e2e",
-  gulp.series(
-    async function setEnv() {
-      process.env.NODE_ENV = "production";
-    },
-    "clean-e2e-test-app",
-    "translations-enable-merge-backend",
-    gulp.parallel("gen-icons-json", "build-translations", "build-locale-data"),
-    "copy-static-e2e-test-app",
-    "rspack-prod-e2e-test-app-e2e",
-    "gen-pages-e2e-test-app-prod"
-  )
-);

build-scripts/gulp/entry-html.js

@@ -225,16 +225,6 @@ gulp.task(
   )
 );
 
-gulp.task(
-  "gen-pages-demo-prod-e2e",
-  genPagesProdTask(
-    DEMO_PAGE_ENTRIES,
-    paths.demo_dir,
-    paths.demo_output_root,
-    paths.demo_output_latest
-  )
-);
-
 const GALLERY_PAGE_ENTRIES = { "index.html": ["entrypoint"] };
 
 gulp.task(

build-scripts/gulp/licenses.js

@@ -29,7 +29,7 @@ const LICENSE_OVERRIDES = [
     // type-fest ships two license files (MIT for code, CC0 for types).
     // We use the MIT license since that covers the bundled code.
     packageName: "type-fest",
-    version: "5.8.0",
+    version: "5.7.0",
     licenseFile: "license-mit",
   },
 ];

build-scripts/gulp/rspack.js

@@ -37,7 +37,6 @@ const isWsl =
  *   listenHost?: string,
  *   open?: boolean,
  *   logUrlAfterFirstBuild?: boolean,
- *   suite?: string,
  * }}
  */
 const runDevServer = async ({
@@ -48,7 +47,6 @@ const runDevServer = async ({
   open = true,
   logUrlAfterFirstBuild = false,
   proxy = undefined,
-  suite = undefined,
 }) => {
   if (listenHost === undefined) {
     // For dev container, we need to listen on all hosts
@@ -83,19 +81,6 @@ const runDevServer = async ({
             !error?.message?.includes("ResizeObserver loop"),
         },
       },
-      setupMiddlewares: (middlewares) => {
-        // Status endpoint so the dev-server manager can confirm this is our
-        // server for the expected suite. Unshifted to beat the static handler.
-        middlewares.unshift({
-          name: "ha-dev-status",
-          path: "/__ha_dev_status",
-          middleware: (_req, res) => {
-            res.setHeader("Content-Type", "application/json");
-            res.end(JSON.stringify({ server: "ha-frontend-dev", suite, port }));
-          },
-        });
-        return middlewares;
-      },
       proxy,
     },
     compiler
@@ -167,8 +152,6 @@ gulp.task("rspack-dev-server-demo", () =>
     ),
     contentBase: paths.demo_output_root,
     port: 8090,
-    open: false,
-    suite: "demo",
   })
 );
 
@@ -177,18 +160,6 @@ gulp.task("rspack-prod-demo", () =>
     bothBuilds(createDemoConfig, {
       isProdBuild: true,
       isStatsBuild: env.isStatsBuild(),
-      isTestBuild: env.isTestBuild(),
-    })
-  )
-);
-
-gulp.task("rspack-prod-demo-e2e", () =>
-  prodBuild(
-    createDemoConfig({
-      isProdBuild: true,
-      latestBuild: true,
-      isStatsBuild: env.isStatsBuild(),
-      isTestBuild: env.isTestBuild(),
     })
   )
 );
@@ -202,7 +173,6 @@ gulp.task("rspack-dev-server-cast", () =>
     port: 8080,
     // Accessible from the network, because that's how Cast hits it.
     listenHost: "0.0.0.0",
-    suite: "cast",
   })
 );
 
@@ -224,7 +194,6 @@ gulp.task("rspack-dev-server-gallery", () =>
     listenHost: "0.0.0.0",
     open: false,
     logUrlAfterFirstBuild: true,
-    suite: "gallery",
   })
 );
 
@@ -272,7 +241,6 @@ gulp.task("rspack-dev-server-e2e-test-app", () =>
     contentBase: paths.e2eTestApp_output_root,
     port: 8095,
     open: false,
-    suite: "e2e-app",
   })
 );
 
@@ -281,18 +249,6 @@ gulp.task("rspack-prod-e2e-test-app", () =>
     bothBuilds(createE2eTestAppConfig, {
       isProdBuild: true,
       isStatsBuild: env.isStatsBuild(),
-      isTestBuild: env.isTestBuild(),
-    })
-  )
-);
-
-gulp.task("rspack-prod-e2e-test-app-e2e", () =>
-  prodBuild(
-    createE2eTestAppConfig({
-      isProdBuild: true,
-      latestBuild: true,
-      isStatsBuild: env.isStatsBuild(),
-      isTestBuild: env.isTestBuild(),
     })
   )
 );

build-scripts/rspack.cjs

@@ -387,14 +387,9 @@ const createAppConfig = ({
     bundle.config.app({ isProdBuild, latestBuild, isStatsBuild, isTestBuild })
   );
 
-const createDemoConfig = ({
-  isProdBuild,
-  latestBuild,
-  isStatsBuild,
-  isTestBuild,
-}) =>
+const createDemoConfig = ({ isProdBuild, latestBuild, isStatsBuild }) =>
   createRspackConfig(
-    bundle.config.demo({ isProdBuild, latestBuild, isStatsBuild, isTestBuild })
+    bundle.config.demo({ isProdBuild, latestBuild, isStatsBuild })
   );
 
 const createCastConfig = ({ isProdBuild, latestBuild }) =>
@@ -406,19 +401,9 @@ const createGalleryConfig = ({ isProdBuild, latestBuild }) =>
 const createLandingPageConfig = ({ isProdBuild, latestBuild }) =>
   createRspackConfig(bundle.config.landingPage({ isProdBuild, latestBuild }));
 
-const createE2eTestAppConfig = ({
-  isProdBuild,
-  latestBuild,
-  isStatsBuild,
-  isTestBuild,
-}) =>
+const createE2eTestAppConfig = ({ isProdBuild, latestBuild, isStatsBuild }) =>
   createRspackConfig(
-    bundle.config.e2eTestApp({
-      isProdBuild,
-      latestBuild,
-      isStatsBuild,
-      isTestBuild,
-    })
+    bundle.config.e2eTestApp({ isProdBuild, latestBuild, isStatsBuild })
   );
 
 module.exports = {

cast/src/launcher/layout/hc-cast.ts

@@ -56,100 +56,88 @@ class HcCast extends LitElement {
 
     return html`
       <hc-layout .auth=${this.auth} .connection=${this.connection}>
-        ${
-          this.askWrite
+        ${this.askWrite
+          ? html`
+              <p class="question action-item">
+                Stay logged in?
+                <span>
+                  <ha-button
+                    appearance="plain"
+                    size="small"
+                    @click=${this._handleSaveTokens}
+                  >
+                    YES
+                  </ha-button>
+                  <ha-button
+                    appearance="plain"
+                    size="small"
+                    @click=${this._handleSkipSaveTokens}
+                  >
+                    NO
+                  </ha-button>
+                </span>
+              </p>
+            `
+          : ""}
+        ${error
+          ? html` <div class="card-content">${error}</div> `
+          : !this.castManager.status
             ? html`
-                <p class="question action-item">
-                  Stay logged in?
-                  <span>
-                    <ha-button
-                      appearance="plain"
-                      size="small"
-                      @click=${this._handleSaveTokens}
-                    >
-                      YES
-                    </ha-button>
-                    <ha-button
-                      appearance="plain"
-                      size="small"
-                      @click=${this._handleSkipSaveTokens}
-                    >
-                      NO
-                    </ha-button>
-                  </span>
+                <p class="center-item">
+                  <ha-button @click=${this._handleLaunch}>
+                    <ha-svg-icon slot="start" .path=${mdiCast}></ha-svg-icon>
+                    Start Casting
+                  </ha-button>
                 </p>
               `
-            : ""
-        }
-        ${
-          error
-            ? html` <div class="card-content">${error}</div> `
-            : !this.castManager.status
-              ? html`
-                  <p class="center-item">
-                    <ha-button @click=${this._handleLaunch}>
-                      <ha-svg-icon slot="start" .path=${mdiCast}></ha-svg-icon>
-                      Start Casting
-                    </ha-button>
-                  </p>
-                `
-              : html`
-                  <div class="section-header">PICK A VIEW</div>
-                  <ha-list @action=${this._handlePickView} activatable>
-                    ${(
-                      this.lovelaceViews ?? [
-                        {
-                          title: "Home",
-                        },
-                      ]
-                    ).map(
-                      (view, idx) => html`
-                        <ha-list-item
-                          graphic="avatar"
-                          .activated=${
-                            this.castManager.status?.lovelacePath ===
-                            (view.path ?? idx)
-                          }
-                          .selected=${
-                            this.castManager.status?.lovelacePath ===
-                            (view.path ?? idx)
-                          }
-                        >
-                          ${view.title || view.path || "Unnamed view"}
-                          ${
-                            view.icon
-                              ? html`
-                                  <ha-icon
-                                    .icon=${view.icon}
-                                    slot="graphic"
-                                  ></ha-icon>
-                                `
-                              : html`<ha-svg-icon
-                                  slot="item-icon"
-                                  .path=${mdiViewDashboard}
-                                ></ha-svg-icon>`
-                          }
-                        </ha-list-item>
-                      `
-                    )}</ha-list
-                  >
-                `
-        }
+            : html`
+                <div class="section-header">PICK A VIEW</div>
+                <ha-list @action=${this._handlePickView} activatable>
+                  ${(
+                    this.lovelaceViews ?? [
+                      {
+                        title: "Home",
+                      },
+                    ]
+                  ).map(
+                    (view, idx) => html`
+                      <ha-list-item
+                        graphic="avatar"
+                        .activated=${this.castManager.status?.lovelacePath ===
+                        (view.path ?? idx)}
+                        .selected=${this.castManager.status?.lovelacePath ===
+                        (view.path ?? idx)}
+                      >
+                        ${view.title || view.path || "Unnamed view"}
+                        ${view.icon
+                          ? html`
+                              <ha-icon
+                                .icon=${view.icon}
+                                slot="graphic"
+                              ></ha-icon>
+                            `
+                          : html`<ha-svg-icon
+                              slot="item-icon"
+                              .path=${mdiViewDashboard}
+                            ></ha-svg-icon>`}
+                      </ha-list-item>
+                    `
+                  )}</ha-list
+                >
+              `}
 
         <div class="card-actions">
-          ${
-            this.castManager.status
-              ? html`
-                  <ha-button appearance="plain" @click=${this._handleLaunch}>
-                    <ha-svg-icon
-                      slot="start"
-                      .path=${mdiCastConnected}
-                    ></ha-svg-icon>
-                    Manage
-                  </ha-button>
-                `
-              : ""
-          }
+          ${this.castManager.status
+            ? html`
+                <ha-button appearance="plain" @click=${this._handleLaunch}>
+                  <ha-svg-icon
+                    slot="start"
+                    .path=${mdiCastConnected}
+                  ></ha-svg-icon>
+                  Manage
+                </ha-button>
+              `
+            : ""}
           <div class="spacer"></div>
           <ha-button
             variant="danger"

cast/src/launcher/layout/hc-connect.ts

@@ -135,11 +135,9 @@ export class HcConnect extends LitElement {
               Show Demo
               <ha-svg-icon
                 slot="end"
-                .path=${
-                  this.castManager.castState === "CONNECTED"
-                    ? mdiCastConnected
-                    : mdiCast
-                }
+                .path=${this.castManager.castState === "CONNECTED"
+                  ? mdiCastConnected
+                  : mdiCast}
               ></ha-svg-icon>
             </ha-button>
             <div class="spacer"></div>

cast/src/launcher/layout/hc-layout.ts

@@ -26,20 +26,18 @@ class HcLayout extends LitElement {
           />
           <h1 class="card-header">
             Home Assistant Cast${this.subtitle ? ` – ${this.subtitle}` : ""}
-            ${
-              this.auth
-                ? html`
-                    <div class="subtitle">
-                      <a href=${this.auth.data.hassUrl} target="_blank"
-                        >${this.auth.data.hassUrl.substr(
-                          this.auth.data.hassUrl.indexOf("//") + 2
-                        )}</a
-                      >
-                      ${this.user ? html` – ${this.user.name} ` : ""}
-                    </div>
-                  `
-                : ""
-            }
+            ${this.auth
+              ? html`
+                  <div class="subtitle">
+                    <a href=${this.auth.data.hassUrl} target="_blank"
+                      >${this.auth.data.hassUrl.substr(
+                        this.auth.data.hassUrl.indexOf("//") + 2
+                      )}</a
+                    >
+                    ${this.user ? html` – ${this.user.name} ` : ""}
+                  </div>
+                `
+              : ""}
           </h1>
           <slot></slot>
         </div>

demo/script/develop_demo

@@ -1,10 +1,9 @@
 #!/bin/sh
-# Develop the demo. Pass --background/--status/--stop/--logs to manage a
-# detached instance (see build-scripts/dev-server.mjs).
+# Develop the demo
 
 # Stop on errors
 set -e
 
 cd "$(dirname "$0")/../.."
 
-exec node build-scripts/dev-server.mjs --suite demo "$@"
+./node_modules/.bin/gulp develop-demo

demo/src/cloud/cloud-demo-controls.ts

@@ -1,304 +0,0 @@
-import { mdiClose, mdiFlaskOutline } from "@mdi/js";
-import { css, html, LitElement, nothing } from "lit";
-import { customElement, state } from "lit/decorators";
-import { fireEvent } from "../../../src/common/dom/fire_event";
-import { mainWindow } from "../../../src/common/dom/get_main_window";
-import { navigate } from "../../../src/common/navigate";
-import "../../../src/components/ha-button";
-import "../../../src/components/ha-card";
-import "../../../src/components/ha-icon-button";
-import "../../../src/components/ha-svg-icon";
-import "../../../src/components/ha-switch";
-import type { HaSwitch } from "../../../src/components/ha-switch";
-import type { CloudDemoScenario } from "../stubs/cloud-demo-state";
-import {
-  getCloudDemoScenario,
-  setCloudDemoScenario,
-  subscribeCloudDemoScenario,
-} from "../stubs/cloud-demo-state";
-
-// Walk the DOM, descending into shadow roots, to find the first matching
-// element. Used to reach <ha-panel-config> (which owns the cloud status) so we
-// can ask it to re-fetch after a scenario change.
-const deepQuery = (
-  selector: string,
-  root: Document | ShadowRoot = document
-): Element | null => {
-  const direct = root.querySelector(selector);
-  if (direct) {
-    return direct;
-  }
-  const elements = root.querySelectorAll("*");
-  for (const element of elements) {
-    const shadow = element.shadowRoot;
-    if (shadow) {
-      const found = deepQuery(selector, shadow);
-      if (found) {
-        return found;
-      }
-    }
-  }
-  return null;
-};
-
-/**
- * Demo-only floating panel that flips the mocked Home Assistant Cloud state so
- * reviewers can preview every UI state of the cloud account page. It writes to
- * the shared {@link CloudDemoScenario} (which the cloud/backup mocks read) and
- * then nudges the page to re-read it. Lives entirely under demo/.
- */
-@customElement("cloud-demo-controls")
-export class CloudDemoControls extends LitElement {
-  @state() private _open = true;
-
-  @state() private _visible = false;
-
-  @state() private _scenario: CloudDemoScenario = getCloudDemoScenario();
-
-  private _unsub?: () => void;
-
-  // The demo uses hash-based routing (navigate() sets location.hash), so the
-  // active route lives in the hash, not the pathname.
-  private get _currentPath(): string {
-    const hash = mainWindow.location.hash;
-    return hash.startsWith("#/") ? hash.slice(1) : mainWindow.location.pathname;
-  }
-
-  private _locationChanged = () => {
-    this._visible = this._currentPath.startsWith("/config/cloud");
-  };
-
-  public connectedCallback(): void {
-    super.connectedCallback();
-    this._locationChanged();
-    mainWindow.addEventListener("location-changed", this._locationChanged);
-    mainWindow.addEventListener("popstate", this._locationChanged);
-    mainWindow.addEventListener("hashchange", this._locationChanged);
-    this._unsub = subscribeCloudDemoScenario((scenario) => {
-      this._scenario = { ...scenario };
-    });
-  }
-
-  public disconnectedCallback(): void {
-    super.disconnectedCallback();
-    mainWindow.removeEventListener("location-changed", this._locationChanged);
-    mainWindow.removeEventListener("popstate", this._locationChanged);
-    mainWindow.removeEventListener("hashchange", this._locationChanged);
-    this._unsub?.();
-  }
-
-  protected render() {
-    if (!this._visible) {
-      return nothing;
-    }
-    if (!this._open) {
-      return html`
-        <ha-icon-button
-          class="fab"
-          label="Cloud demo controls"
-          .path=${mdiFlaskOutline}
-          @click=${this._toggleOpen}
-        ></ha-icon-button>
-      `;
-    }
-    return html`
-      <ha-card>
-        <div class="header">
-          <ha-svg-icon .path=${mdiFlaskOutline}></ha-svg-icon>
-          <span class="title">Cloud demo controls</span>
-          <ha-icon-button
-            label="Close"
-            .path=${mdiClose}
-            @click=${this._toggleOpen}
-          ></ha-icon-button>
-        </div>
-        <p class="note">
-          Demo only. Flips the mocked cloud state shown on this page.
-        </p>
-        <div class="controls">
-          ${this._segment("Subscription", "account", [
-            ["active", "Active"],
-            ["trialing", "Trialing"],
-            ["canceled", "Canceled"],
-            ["expired", "Expired"],
-            ["unknown", "Unknown"],
-          ])}
-          ${this._toggle("Onboarded", "onboarded")}
-          ${this._toggle("Onboarding postponed", "postponed")}
-          ${this._toggle("Remote access", "remote")}
-          ${this._segment("Remote status", "remoteStatus", [
-            ["ready", "Ready"],
-            ["generating", "Preparing"],
-            ["loading", "Loading"],
-            ["loaded", "Loaded"],
-            ["error", "Error"],
-          ])}
-          ${this._segment("Backups", "backup", [
-            ["fresh", "Recent"],
-            ["stale", "Old"],
-            ["failed", "Failed"],
-            ["local", "Local only"],
-            ["none", "None"],
-          ])}
-          ${this._toggle("Alexa linked", "alexa")}
-          ${this._toggle("Google linked", "google")}
-          ${this._toggle("Cameras (WebRTC)", "webrtc")}
-          ${this._toggle("Has webhooks", "webhooks")}
-        </div>
-      </ha-card>
-    `;
-  }
-
-  private _segment(
-    label: string,
-    field: keyof CloudDemoScenario,
-    options: [string, string][]
-  ) {
-    return html`
-      <div class="row">
-        <span>${label}</span>
-        <div class="segment">
-          ${options.map(
-            ([value, text]) => html`
-              <ha-button
-                size="s"
-                appearance=${
-                  this._scenario[field] === value ? "filled" : "plain"
-                }
-                data-field=${field}
-                data-value=${value}
-                @click=${this._segmentClick}
-              >
-                ${text}
-              </ha-button>
-            `
-          )}
-        </div>
-      </div>
-    `;
-  }
-
-  private _toggle(label: string, field: keyof CloudDemoScenario) {
-    return html`
-      <div class="row">
-        <span>${label}</span>
-        <ha-switch
-          .checked=${this._scenario[field] as boolean}
-          data-field=${field}
-          @change=${this._toggleChange}
-        ></ha-switch>
-      </div>
-    `;
-  }
-
-  private _toggleOpen() {
-    this._open = !this._open;
-  }
-
-  private _segmentClick(ev: Event) {
-    const target = ev.currentTarget as HTMLElement;
-    this._set(
-      target.dataset.field as keyof CloudDemoScenario,
-      target.dataset.value!
-    );
-  }
-
-  private _toggleChange(ev: Event) {
-    const target = ev.target as HaSwitch;
-    this._set(target.dataset.field as keyof CloudDemoScenario, target.checked);
-  }
-
-  private _set(field: keyof CloudDemoScenario, value: string | boolean) {
-    setCloudDemoScenario({ [field]: value } as Partial<CloudDemoScenario>);
-    this._refresh();
-  }
-
-  private _refresh() {
-    // Refresh the shared cloud status so login-state changes (signed out) and
-    // status-derived fields update.
-    const panel = deepQuery("ha-panel-config");
-    if (panel) {
-      fireEvent(panel as HTMLElement, "ha-refresh-cloud-status");
-    }
-    // cloud-account fetches its subscription/backup/webhook data once on mount
-    // and is not cached by the router, so bounce through a sibling cloud route
-    // to force a clean remount that re-reads the updated mocks.
-    const path = this._currentPath;
-    if (path.startsWith("/config/cloud") && path !== "/config/cloud/login") {
-      const sibling =
-        path === "/config/cloud/remote"
-          ? "/config/cloud/account"
-          : "/config/cloud/remote";
-      navigate(sibling, { replace: true });
-      window.setTimeout(() => navigate(path, { replace: true }), 0);
-    }
-  }
-
-  static styles = css`
-    :host {
-      position: fixed;
-      right: 16px;
-      bottom: 16px;
-      z-index: 9999;
-    }
-    .fab {
-      --mdc-icon-button-size: 48px;
-      --mdc-icon-size: 24px;
-      background-color: var(--primary-color);
-      color: var(--text-primary-color, #fff);
-      border-radius: 50%;
-      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
-    }
-    ha-card {
-      display: block;
-      width: 320px;
-      max-height: 80vh;
-      overflow: auto;
-      box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
-    }
-    .header {
-      display: flex;
-      align-items: center;
-      gap: 8px;
-      padding: 8px 8px 8px 16px;
-      border-bottom: 1px solid var(--divider-color);
-    }
-    .header .title {
-      flex: 1;
-      font-weight: var(--ha-font-weight-medium, 500);
-    }
-    .header ha-svg-icon {
-      color: var(--secondary-text-color);
-    }
-    .note {
-      margin: 8px 16px;
-      color: var(--secondary-text-color);
-      font-size: var(--ha-font-size-s, 0.875rem);
-    }
-    .controls {
-      display: flex;
-      flex-direction: column;
-      gap: 8px;
-      padding: 0 16px 16px;
-    }
-    .row {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      gap: 12px;
-      min-height: 36px;
-    }
-    .segment {
-      display: flex;
-      gap: 4px;
-      flex-wrap: wrap;
-      justify-content: flex-end;
-    }
-  `;
-}
-
-declare global {
-  interface HTMLElementTagNameMap {
-    "cloud-demo-controls": CloudDemoControls;
-  }
-}

demo/src/configs/demo-configs.ts

@@ -1,16 +1,7 @@
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 import type { Lovelace } from "../../../src/panels/lovelace/types";
 import { energyEntities } from "../stubs/entities";
-import { getDemoTheme } from "../stubs/frontend";
-import type { DemoConfig, DemoTheme } from "./types";
-
-export const applyDemoTheme = (hass: MockHomeAssistant, theme: DemoTheme) => {
-  if (typeof theme === "function") {
-    hass.mockTheme(theme());
-    return;
-  }
-  hass.mockTheme(null, getDemoTheme(theme));
-};
+import type { DemoConfig } from "./types";
 
 export const demoConfigs: (() => Promise<DemoConfig>)[] = [
   () => import("./sections").then((mod) => mod.demoSections),
@@ -40,5 +31,5 @@ export const setDemoConfig = async (
   hass.addEntities(config.entities(hass.localize), true);
   hass.addEntities(energyEntities());
   lovelace.saveConfig(config.lovelace(hass.localize));
-  applyDemoTheme(hass, config.theme);
+  hass.mockTheme(config.theme());
 };

demo/src/configs/sections/index.ts

@@ -8,5 +8,5 @@ export const demoSections: DemoConfig = {
   name: "Home Demo",
   lovelace: demoLovelaceSections,
   entities: demoEntitiesSections,
-  theme: { theme: "default", dark: false },
+  theme: () => ({}),
 };

demo/src/configs/types.ts

@@ -2,9 +2,6 @@ import type { TemplateResult } from "lit";
 import type { LocalizeFunc } from "../../../src/common/translations/localize";
 import type { LovelaceConfig } from "../../../src/data/lovelace/config/types";
 import type { EntityInput } from "../../../src/fake_data/entities/types";
-import type { ThemeSettings } from "../../../src/types";
-
-export type DemoTheme = ThemeSettings | (() => Record<string, string> | null);
 
 export interface DemoConfig {
   index?: number;
@@ -12,8 +9,9 @@ export interface DemoConfig {
   authorName: string;
   authorUrl: string;
   description?:
-    string | ((localize: LocalizeFunc) => string | TemplateResult<1>);
+    | string
+    | ((localize: LocalizeFunc) => string | TemplateResult<1>);
   lovelace: (localize: LocalizeFunc) => LovelaceConfig;
   entities: (localize: LocalizeFunc) => EntityInput[];
-  theme: DemoTheme;
+  theme: () => Record<string, string> | null;
 }

demo/src/custom-cards/ha-demo-card.ts

@@ -43,30 +43,28 @@ export class HADemoCard extends LitElement implements LovelaceCard {
       <ha-card>
         <div class="picker">
           <div class="label">
-            ${
-              this._switching
-                ? html`<ha-spinner></ha-spinner>`
-                : until(
-                    selectedDemoConfig.then(
-                      (conf) => html`
-                        ${conf.name}
-                        <small>
-                          ${this.hass.localize(
-                            "ui.panel.page-demo.cards.demo.demo_by",
-                            {
-                              name: html`
-                                <a target="_blank" href=${conf.authorUrl}>
-                                  ${conf.authorName}
-                                </a>
-                              `,
-                            }
-                          )}
-                        </small>
-                      `
-                    ),
-                    ""
-                  )
-            }
+            ${this._switching
+              ? html`<ha-spinner></ha-spinner>`
+              : until(
+                  selectedDemoConfig.then(
+                    (conf) => html`
+                      ${conf.name}
+                      <small>
+                        ${this.hass.localize(
+                          "ui.panel.page-demo.cards.demo.demo_by",
+                          {
+                            name: html`
+                              <a target="_blank" href=${conf.authorUrl}>
+                                ${conf.authorName}
+                              </a>
+                            `,
+                          }
+                        )}
+                      </small>
+                    `
+                  ),
+                  ""
+                )}
           </div>
 
           <ha-button @click=${this._nextConfig} .disabled=${this._switching}>

demo/src/ha-demo.ts

@@ -5,7 +5,7 @@ import type { MockHomeAssistant } from "../../src/fake_data/provide_hass";
 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 { selectedDemoConfig } from "./configs/demo-configs";
 import { mockAreaRegistry } from "./stubs/area_registry";
 import { mockAuth } from "./stubs/auth";
 import { demoDevices } from "./stubs/devices";
@@ -29,13 +29,11 @@ import { mockSystemLog } from "./stubs/system_log";
 import { mockTemplate } from "./stubs/template";
 import { mockTodo } from "./stubs/todo";
 import { mockTranslations } from "./stubs/translations";
-import "./cloud/cloud-demo-controls";
 
 // WS command / REST path prefixes whose mocks live in the lazily imported
 // config-panel chunk (see ./stubs/config-panel). Must stay in sync with it.
 const CONFIG_PANEL_COMMANDS = [
   "cloud/",
-  "webhook/list",
   "validate_config",
   "config_entries/",
   "device_automation/",
@@ -71,22 +69,6 @@ export class HaDemo extends HomeAssistantAppEl {
     // `false` for contexts: HomeAssistantAppEl already provides them via
     // `contextMixin`, so let provideHass skip them to avoid duplicate providers.
     const hass = provideHass(this, initial, true, false);
-
-    // 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.
-    hass.updateHass({
-      config: {
-        ...hass.config,
-        components: [...(hass.config?.components ?? []), "backup", "webhook"],
-      },
-    });
-
-    // Demo-only floating panel to flip the mocked cloud state. Mounted once at
-    // the document level; it shows itself only on the cloud panel.
-    if (!document.querySelector("cloud-demo-controls")) {
-      document.body.appendChild(document.createElement("cloud-demo-controls"));
-    }
     const localizePromise =
       // @ts-ignore
       this._loadFragmentTranslations(hass.language, "page-demo").then(
@@ -173,7 +155,9 @@ export class HaDemo extends HomeAssistantAppEl {
     Promise.all([selectedDemoConfig, localizePromise]).then(
       ([conf, localize]) => {
         hass.addEntities(conf.entities(localize));
-        applyDemoTheme(hass, conf.theme);
+        if (conf.theme) {
+          hass.mockTheme(conf.theme());
+        }
       }
     );
 

demo/src/stubs/backup.ts

@@ -7,34 +7,42 @@ import type {
 import { BackupScheduleRecurrence } from "../../../src/data/backup";
 import type { ManagerStateEvent } from "../../../src/data/backup_manager";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
-import type { DemoCloudBackup } from "./cloud-demo-state";
-import {
-  getCloudDemoScenario,
-  setCloudDemoScenario,
-  subscribeCloudDemoScenario,
-} from "./cloud-demo-state";
 
-const CLOUD_AGENT = "cloud.cloud";
+const lastBackupDate = new Date(Date.now() - 86400000).toISOString();
+const nextBackupDate = new Date(Date.now() + 86400000).toISOString();
+
+const backups: BackupContent[] = [
+  {
+    backup_id: "demo-backup-1",
+    name: "Automatic backup DEMO",
+    date: lastBackupDate,
+    with_automatic_settings: true,
+    agents: {
+      "backup.local": { size: 1024 * 1024 * 512, protected: true },
+      "cloud.cloud": { size: 1024 * 1024 * 512, protected: true },
+    },
+  },
+];
 
 const backupInfo: BackupInfo = {
-  backups: [],
+  backups,
   agent_errors: {},
-  last_attempted_automatic_backup: null,
-  last_completed_automatic_backup: null,
+  last_attempted_automatic_backup: lastBackupDate,
+  last_completed_automatic_backup: lastBackupDate,
   last_action_event: { manager_state: "idle" },
-  next_automatic_backup: null,
+  next_automatic_backup: nextBackupDate,
   next_automatic_backup_additional: false,
   state: "idle",
 };
 
 const backupConfig: BackupConfig = {
   automatic_backups_configured: true,
-  last_attempted_automatic_backup: null,
-  last_completed_automatic_backup: null,
-  next_automatic_backup: null,
+  last_attempted_automatic_backup: lastBackupDate,
+  last_completed_automatic_backup: lastBackupDate,
+  next_automatic_backup: nextBackupDate,
   next_automatic_backup_additional: false,
   create_backup: {
-    agent_ids: ["backup.local", CLOUD_AGENT],
+    agent_ids: ["backup.local", "cloud.cloud"],
     include_addons: [],
     include_all_addons: true,
     include_database: true,
@@ -61,132 +69,10 @@ const agentsInfo: BackupAgentsInfo = {
   ],
 };
 
-// Map the demo "Backups" scenario onto the mutable backup config/info, so the
-// cloud overview status line and the backup sub-page reflect the chosen state.
-const applyScenario = () => {
-  const kind = getCloudDemoScenario().backup;
-  const now = Date.now();
-  const recent = new Date(now - 12 * 3600 * 1000).toISOString();
-  const old = new Date(now - 5 * 86400000).toISOString();
-  const future = new Date(now + 86400000).toISOString();
-  // Comfortably past BACKUP_OVERDUE_MARGIN_HOURS (3h) so the "stale" scenario
-  // actually reads as overdue rather than slipping under the margin.
-  const overdue = new Date(now - 6 * 3600 * 1000).toISOString();
-
-  // The cloud agent is a backup target for the cloud-backed states only. For
-  // "local" a backup exists but is stored locally (no cloud copy), and for
-  // "none" there are no automatic backups at all.
-  const cloudEnabled =
-    kind === "fresh" || kind === "stale" || kind === "failed";
-  backupConfig.create_backup.agent_ids = cloudEnabled
-    ? ["backup.local", CLOUD_AGENT]
-    : ["backup.local"];
-
-  switch (kind) {
-    case "fresh":
-      backupConfig.automatic_backups_configured = true;
-      backupConfig.last_completed_automatic_backup = recent;
-      backupConfig.last_attempted_automatic_backup = recent;
-      backupConfig.next_automatic_backup = future;
-      break;
-    case "local":
-      // Automatic backups run, but only to the local agent.
-      backupConfig.automatic_backups_configured = true;
-      backupConfig.last_completed_automatic_backup = recent;
-      backupConfig.last_attempted_automatic_backup = recent;
-      backupConfig.next_automatic_backup = future;
-      break;
-    case "stale":
-      backupConfig.automatic_backups_configured = true;
-      backupConfig.last_completed_automatic_backup = old;
-      backupConfig.last_attempted_automatic_backup = old;
-      // Next scheduled backup is in the past, so it reads as overdue.
-      backupConfig.next_automatic_backup = overdue;
-      break;
-    case "failed":
-      backupConfig.automatic_backups_configured = true;
-      backupConfig.last_completed_automatic_backup = old;
-      // Most recent attempt is newer than the last success, so it failed.
-      backupConfig.last_attempted_automatic_backup = recent;
-      backupConfig.next_automatic_backup = future;
-      break;
-    case "none":
-      backupConfig.automatic_backups_configured = false;
-      backupConfig.last_completed_automatic_backup = null;
-      backupConfig.last_attempted_automatic_backup = null;
-      backupConfig.next_automatic_backup = null;
-      break;
-  }
-
-  backupInfo.last_completed_automatic_backup =
-    backupConfig.last_completed_automatic_backup;
-  backupInfo.last_attempted_automatic_backup =
-    backupConfig.last_attempted_automatic_backup;
-  backupInfo.next_automatic_backup = backupConfig.next_automatic_backup;
-  backupInfo.backups =
-    cloudEnabled && backupConfig.last_completed_automatic_backup
-      ? [
-          {
-            backup_id: "demo-backup-1",
-            name: "Automatic backup DEMO",
-            date: backupConfig.last_completed_automatic_backup,
-            with_automatic_settings: true,
-            agents: {
-              "backup.local": { size: 1024 * 1024 * 512, protected: true },
-              "cloud.cloud": { size: 1024 * 1024 * 512, protected: true },
-            },
-          } as BackupContent,
-        ]
-      : [];
-};
-
-applyScenario();
-subscribeCloudDemoScenario(applyScenario);
-
 export const mockBackup = (hass: MockHomeAssistant) => {
-  // Fresh objects each fetch so re-reading after a mutation actually re-renders
-  // (Lit change detection is identity-based; the real WS API returns new
-  // objects too).
-  hass.mockWS("backup/info", () => ({ ...backupInfo }));
-  hass.mockWS("backup/config/info", () => ({ config: { ...backupConfig } }));
+  hass.mockWS("backup/info", () => backupInfo);
+  hass.mockWS("backup/config/info", () => ({ config: backupConfig }));
   hass.mockWS("backup/agents/info", () => agentsInfo);
-  hass.mockWS("backup/config/update", (msg) => {
-    const { type, ...update } = msg;
-    if (update.create_backup) {
-      backupConfig.create_backup = {
-        ...backupConfig.create_backup,
-        ...update.create_backup,
-      };
-    }
-    if (update.automatic_backups_configured !== undefined) {
-      backupConfig.automatic_backups_configured =
-        update.automatic_backups_configured;
-    }
-    if (update.schedule) {
-      backupConfig.schedule = { ...backupConfig.schedule, ...update.schedule };
-    }
-    if (update.retention) {
-      backupConfig.retention = update.retention;
-    }
-    if (update.agents) {
-      backupConfig.agents = { ...backupConfig.agents, ...update.agents };
-    }
-    // Reflect the UI-driven backup change into the demo scenario so the demo
-    // controls panel stays in sync with the mocked state.
-    const cloudNow = backupConfig.create_backup.agent_ids.includes(CLOUD_AGENT);
-    const current = getCloudDemoScenario().backup;
-    const next: DemoCloudBackup = !backupConfig.automatic_backups_configured
-      ? "none"
-      : cloudNow
-        ? current === "fresh" || current === "stale" || current === "failed"
-          ? current
-          : "fresh"
-        : "local";
-    if (next !== current) {
-      setCloudDemoScenario({ backup: next });
-    }
-    return null;
-  });
   hass.mockWS(
     "backup/subscribe_events",
     (_msg, _hass, onChange?: (event: ManagerStateEvent) => void) => {

demo/src/stubs/cloud-demo-state.ts

@@ -1,89 +0,0 @@
-// Demo-only switchable Home Assistant Cloud scenario.
-//
-// The redesigned cloud account page (src/panels/config/cloud/account) renders
-// purely from real WS data. To let reviewers preview every UI state without a
-// real cloud account, this module holds a mutable "scenario" that the cloud and
-// backup mocks read from, plus the floating <cloud-demo-controls> panel writes
-// to. It is persisted to localStorage so the choice survives the data the page
-// fetches once per visit (subscription, backup config, webhooks).
-//
-// This lives entirely under demo/ — no production code imports it.
-
-import type { RemoteCertificateStatus } from "../../../src/data/cloud";
-
-// The five PaymentSubscriptionState values.
-export type DemoCloudAccount =
-  "active" | "trialing" | "canceled" | "expired" | "unknown";
-
-// "local": automatic backups are configured, but not to the cloud agent
-// (a backup exists, just no cloud copy). "none": no automatic backups at all.
-export type DemoCloudBackup = "fresh" | "stale" | "failed" | "local" | "none";
-
-export interface CloudDemoScenario {
-  account: DemoCloudAccount;
-  onboarded: boolean;
-  // Onboarding postponed server-side (maps to onboarding_postponed); hides
-  // the onboarding UI without marking it completed.
-  postponed: boolean;
-  remote: boolean;
-  remoteStatus: RemoteCertificateStatus;
-  backup: DemoCloudBackup;
-  alexa: boolean;
-  google: boolean;
-  webrtc: boolean;
-  webhooks: boolean;
-}
-
-export const DEFAULT_CLOUD_DEMO_SCENARIO: CloudDemoScenario = {
-  account: "active",
-  onboarded: true,
-  postponed: false,
-  remote: true,
-  remoteStatus: "ready",
-  backup: "fresh",
-  alexa: true,
-  google: true,
-  webrtc: true,
-  webhooks: true,
-};
-
-const STORAGE_KEY = "cloudDemoScenario";
-
-const readScenario = (): CloudDemoScenario => {
-  try {
-    const raw = window.localStorage.getItem(STORAGE_KEY);
-    if (raw) {
-      return { ...DEFAULT_CLOUD_DEMO_SCENARIO, ...JSON.parse(raw) };
-    }
-  } catch (_err) {
-    // Ignore malformed or unavailable storage and fall back to the default.
-  }
-  return { ...DEFAULT_CLOUD_DEMO_SCENARIO };
-};
-
-let scenario: CloudDemoScenario = readScenario();
-
-const listeners = new Set<(scenario: CloudDemoScenario) => void>();
-
-export const getCloudDemoScenario = (): CloudDemoScenario => scenario;
-
-export const subscribeCloudDemoScenario = (
-  listener: (scenario: CloudDemoScenario) => void
-): (() => void) => {
-  listeners.add(listener);
-  return () => {
-    listeners.delete(listener);
-  };
-};
-
-export const setCloudDemoScenario = (
-  partial: Partial<CloudDemoScenario>
-): void => {
-  scenario = { ...scenario, ...partial };
-  try {
-    window.localStorage.setItem(STORAGE_KEY, JSON.stringify(scenario));
-  } catch (_err) {
-    // Ignore storage failures (e.g. private mode); state still applies in-memory.
-  }
-  listeners.forEach((listener) => listener(scenario));
-};

demo/src/stubs/cloud.ts

@@ -2,15 +2,8 @@ import type {
   CloudStatusLoggedIn,
   SubscriptionInfo,
 } from "../../../src/data/cloud";
-import { ONBOARDING_ITEMS } from "../../../src/data/cloud";
 import type { CloudTTSInfo } from "../../../src/data/cloud/tts";
-import type { Webhook } from "../../../src/data/webhook";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
-import {
-  getCloudDemoScenario,
-  setCloudDemoScenario,
-  subscribeCloudDemoScenario,
-} from "./cloud-demo-state";
 
 const emptyFilter = () => ({
   include_domains: [],
@@ -19,23 +12,8 @@ const emptyFilter = () => ({
   exclude_entities: [],
 });
 
-const demoWebhooks: Webhook[] = [
-  {
-    webhook_id: "demo_front_door",
-    domain: "automation",
-    name: "Front door motion",
-    local_only: false,
-  },
-  {
-    webhook_id: "demo_companion_app",
-    domain: "mobile_app",
-    name: "Companion app",
-    local_only: false,
-  },
-];
-
 // A single mutable status object so that preference changes made in the demo
-// (both via the real UI and the demo scenario controls) are reflected back.
+// are reflected back in the UI.
 const cloudStatus: CloudStatusLoggedIn = {
   logged_in: true,
   cloud: "connected",
@@ -57,8 +35,6 @@ const cloudStatus: CloudStatusLoggedIn = {
   remote_certificate_status: "ready",
   http_use_ssl: false,
   active_subscription: true,
-  onboarding_postponed: false,
-  onboarding_completed: true,
   prefs: {
     google_enabled: true,
     alexa_enabled: true,
@@ -71,8 +47,6 @@ const cloudStatus: CloudStatusLoggedIn = {
     google_report_state: true,
     tts_default_voice: ["en-US", "JennyNeural"],
     cloud_ice_servers_enabled: true,
-    onboarded_items: [...ONBOARDING_ITEMS],
-    onboarding_postponed_until: null,
   },
 };
 
@@ -80,7 +54,6 @@ const subscription: SubscriptionInfo = {
   human_description: "Demo subscription, renews automatically",
   provider: "Nabu Casa, Inc.",
   plan_renewal_date: 4102444800,
-  subscription: { status: "active" },
 };
 
 const ttsInfo: CloudTTSInfo = {
@@ -93,140 +66,17 @@ const ttsInfo: CloudTTSInfo = {
   ],
 };
 
-// Map the high-level demo scenario onto the mutable cloud status / subscription.
-const applyScenario = () => {
-  const scenario = getCloudDemoScenario();
-
-  switch (scenario.account) {
-    case "trialing":
-      cloudStatus.active_subscription = true;
-      subscription.subscription = { status: "trialing" };
-      break;
-    case "canceled":
-      cloudStatus.active_subscription = false;
-      subscription.subscription = { status: "canceled" };
-      break;
-    case "expired":
-      cloudStatus.active_subscription = false;
-      subscription.subscription = { status: "expired" };
-      break;
-    case "unknown":
-      cloudStatus.active_subscription = true;
-      subscription.subscription = { status: "unknown" };
-      break;
-    default:
-      // "active"
-      cloudStatus.active_subscription = true;
-      subscription.subscription = { status: "active" };
-  }
-
-  cloudStatus.prefs.onboarded_items = scenario.onboarded
-    ? [...ONBOARDING_ITEMS]
-    : [];
-  cloudStatus.onboarding_completed = scenario.onboarded;
-  cloudStatus.onboarding_postponed = scenario.postponed;
-  cloudStatus.prefs.onboarding_postponed_until = scenario.postponed
-    ? new Date(Date.now() + 24 * 3600 * 1000).toISOString()
-    : null;
-  cloudStatus.prefs.remote_enabled = scenario.remote;
-  cloudStatus.remote_connected = scenario.remote;
-  cloudStatus.remote_certificate_status = scenario.remoteStatus;
-  cloudStatus.alexa_registered = scenario.alexa;
-  cloudStatus.google_registered = scenario.google;
-  cloudStatus.prefs.cloud_ice_servers_enabled = scenario.webrtc;
-
-  const hasCloudhooks = Object.keys(cloudStatus.prefs.cloudhooks).length > 0;
-  if (scenario.webhooks && !hasCloudhooks) {
-    cloudStatus.prefs.cloudhooks = Object.fromEntries(
-      demoWebhooks.map((webhook) => [
-        webhook.webhook_id,
-        {
-          webhook_id: webhook.webhook_id,
-          cloudhook_id: `demo-${webhook.webhook_id}`,
-          cloudhook_url: `https://hooks.nabu.casa/demo-${webhook.webhook_id}`,
-          managed: false,
-        },
-      ])
-    );
-  } else if (!scenario.webhooks && hasCloudhooks) {
-    cloudStatus.prefs.cloudhooks = {};
-  }
-};
-
-applyScenario();
-subscribeCloudDemoScenario(applyScenario);
-
-// Reflect UI-driven changes (onboarding toggles, remote connect/disconnect)
-// back into the demo scenario so the demo controls panel stays in sync with the
-// mocked state. Only writes when a value actually changed, to avoid needless
-// re-projection. `applyScenario` re-applies the (now matching) scenario, so
-// this stays idempotent and does not fight the direct mutation above.
-const syncScenarioFromStatus = () => {
-  const scenario = getCloudDemoScenario();
-  const next = {
-    onboarded: cloudStatus.onboarding_completed,
-    postponed: cloudStatus.onboarding_postponed,
-    remote: cloudStatus.prefs.remote_enabled,
-    webrtc: cloudStatus.prefs.cloud_ice_servers_enabled,
-    webhooks: Object.keys(cloudStatus.prefs.cloudhooks).length > 0,
-  };
-  if (
-    scenario.onboarded !== next.onboarded ||
-    scenario.postponed !== next.postponed ||
-    scenario.remote !== next.remote ||
-    scenario.webrtc !== next.webrtc ||
-    scenario.webhooks !== next.webhooks
-  ) {
-    setCloudDemoScenario(next);
-  }
-};
-
 export const mockCloud = (hass: MockHomeAssistant) => {
-  hass.mockWS("cloud/status", () => ({
-    ...cloudStatus,
-    prefs: { ...cloudStatus.prefs },
-  }));
+  hass.mockWS("cloud/status", () => cloudStatus);
   hass.mockWS("cloud/subscription", () => subscription);
   hass.mockWS("cloud/tts/info", () => ttsInfo);
-  hass.mockWS("webhook/list", () => demoWebhooks);
 
   hass.mockWS("cloud/update_prefs", (msg) => {
     const { type, ...prefs } = msg;
     cloudStatus.prefs = { ...cloudStatus.prefs, ...prefs };
-    syncScenarioFromStatus();
     return { success: true };
   });
 
-  hass.mockWS("cloud/onboarding/postpone", () => {
-    cloudStatus.prefs.onboarding_postponed_until = new Date(
-      Date.now() + 24 * 3600 * 1000
-    ).toISOString();
-    cloudStatus.onboarding_postponed = true;
-    syncScenarioFromStatus();
-    // Backend returns the full logged-in status object.
-    return { ...cloudStatus, prefs: { ...cloudStatus.prefs } };
-  });
-
-  hass.mockWS("cloud/onboarding/complete", (msg) => {
-    const items: string[] = msg.items ?? [];
-    const missing = items.filter(
-      (item) => !cloudStatus.prefs.onboarded_items.includes(item)
-    );
-    if (missing.length) {
-      cloudStatus.prefs.onboarded_items = [
-        ...cloudStatus.prefs.onboarded_items,
-        ...missing,
-      ];
-    }
-    cloudStatus.onboarding_completed = ONBOARDING_ITEMS.every(
-      (onboardingItem) =>
-        cloudStatus.prefs.onboarded_items.includes(onboardingItem)
-    );
-    syncScenarioFromStatus();
-    // Backend returns the full logged-in status object.
-    return { ...cloudStatus, prefs: { ...cloudStatus.prefs } };
-  });
-
   hass.mockWS("cloud/cloudhook/create", (msg) => {
     const webhook = {
       webhook_id: msg.webhook_id,
@@ -245,20 +95,15 @@ export const mockCloud = (hass: MockHomeAssistant) => {
     const cloudhooks = { ...cloudStatus.prefs.cloudhooks };
     delete cloudhooks[msg.webhook_id];
     cloudStatus.prefs.cloudhooks = cloudhooks;
-    syncScenarioFromStatus();
     return null;
   });
 
   hass.mockWS("cloud/remote/connect", () => {
     cloudStatus.remote_connected = true;
-    cloudStatus.prefs.remote_enabled = true;
-    syncScenarioFromStatus();
     return null;
   });
   hass.mockWS("cloud/remote/disconnect", () => {
     cloudStatus.remote_connected = false;
-    cloudStatus.prefs.remote_enabled = false;
-    syncScenarioFromStatus();
     return null;
   });
 

demo/src/stubs/energy.ts

@@ -8,100 +8,103 @@ import type {
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockEnergy = (hass: MockHomeAssistant) => {
-  hass.mockWS("energy/get_prefs", (): EnergyPreferences => ({
-    energy_sources: [
-      {
-        type: "grid",
-        stat_energy_from: "sensor.energy_consumption_tarif_1",
-        stat_energy_to: "sensor.energy_production_tarif_1",
-        stat_cost: "sensor.energy_consumption_tarif_1_cost",
-        stat_compensation: "sensor.energy_production_tarif_1_compensation",
-        entity_energy_price: null,
-        number_energy_price: null,
-        entity_energy_price_export: null,
-        number_energy_price_export: null,
-        stat_rate: "sensor.power_grid",
-        cost_adjustment_day: 0,
-      },
-      {
-        type: "grid",
-        stat_energy_from: "sensor.energy_consumption_tarif_2",
-        stat_energy_to: "sensor.energy_production_tarif_2",
-        stat_cost: "sensor.energy_consumption_tarif_2_cost",
-        stat_compensation: "sensor.energy_production_tarif_2_compensation",
-        entity_energy_price: null,
-        number_energy_price: null,
-        entity_energy_price_export: null,
-        number_energy_price_export: null,
-        stat_rate: "sensor.power_grid_return",
-        cost_adjustment_day: 0,
-      },
-      {
-        type: "solar",
-        stat_energy_from: "sensor.solar_production",
-        stat_rate: "sensor.power_solar",
-        config_entry_solar_forecast: ["solar_forecast"],
-      },
-      {
-        type: "battery",
-        stat_energy_from: "sensor.battery_output",
-        stat_energy_to: "sensor.battery_input",
-        stat_rate: "sensor.power_battery",
-      },
-      {
-        type: "gas",
-        stat_energy_from: "sensor.energy_gas",
-        stat_cost: "sensor.energy_gas_cost",
-        entity_energy_price: null,
-        number_energy_price: null,
-      },
-      {
-        type: "water",
-        stat_energy_from: "sensor.energy_water",
-        stat_cost: "sensor.energy_water_cost",
-        entity_energy_price: null,
-        number_energy_price: null,
-      },
-    ],
-    device_consumption: [
-      {
-        stat_consumption: "sensor.energy_car",
-        stat_rate: "sensor.power_car",
-      },
-      {
-        stat_consumption: "sensor.energy_ac",
-        stat_rate: "sensor.power_ac",
-      },
-      {
-        stat_consumption: "sensor.energy_washing_machine",
-        stat_rate: "sensor.power_washing_machine",
-      },
-      {
-        stat_consumption: "sensor.energy_dryer",
-        stat_rate: "sensor.power_dryer",
-      },
-      {
-        stat_consumption: "sensor.energy_heat_pump",
-        stat_rate: "sensor.power_heat_pump",
-      },
-      {
-        stat_consumption: "sensor.energy_boiler",
-        stat_rate: "sensor.power_boiler",
-      },
-    ],
-    device_consumption_water: [
-      {
-        stat_consumption: "sensor.water_kitchen",
-      },
-      {
-        stat_consumption: "sensor.water_garden",
-      },
-    ],
-  }));
-  hass.mockWS("energy/info", (): EnergyInfo => ({
-    cost_sensors: {},
-    solar_forecast_domains: [],
-  }));
+  hass.mockWS(
+    "energy/get_prefs",
+    (): EnergyPreferences => ({
+      energy_sources: [
+        {
+          type: "grid",
+          stat_energy_from: "sensor.energy_consumption_tarif_1",
+          stat_energy_to: "sensor.energy_production_tarif_1",
+          stat_cost: "sensor.energy_consumption_tarif_1_cost",
+          stat_compensation: "sensor.energy_production_tarif_1_compensation",
+          entity_energy_price: null,
+          number_energy_price: null,
+          entity_energy_price_export: null,
+          number_energy_price_export: null,
+          stat_rate: "sensor.power_grid",
+          cost_adjustment_day: 0,
+        },
+        {
+          type: "grid",
+          stat_energy_from: "sensor.energy_consumption_tarif_2",
+          stat_energy_to: "sensor.energy_production_tarif_2",
+          stat_cost: "sensor.energy_consumption_tarif_2_cost",
+          stat_compensation: "sensor.energy_production_tarif_2_compensation",
+          entity_energy_price: null,
+          number_energy_price: null,
+          entity_energy_price_export: null,
+          number_energy_price_export: null,
+          stat_rate: "sensor.power_grid_return",
+          cost_adjustment_day: 0,
+        },
+        {
+          type: "solar",
+          stat_energy_from: "sensor.solar_production",
+          stat_rate: "sensor.power_solar",
+          config_entry_solar_forecast: ["solar_forecast"],
+        },
+        {
+          type: "battery",
+          stat_energy_from: "sensor.battery_output",
+          stat_energy_to: "sensor.battery_input",
+          stat_rate: "sensor.power_battery",
+        },
+        {
+          type: "gas",
+          stat_energy_from: "sensor.energy_gas",
+          stat_cost: "sensor.energy_gas_cost",
+          entity_energy_price: null,
+          number_energy_price: null,
+        },
+        {
+          type: "water",
+          stat_energy_from: "sensor.energy_water",
+          stat_cost: "sensor.energy_water_cost",
+          entity_energy_price: null,
+          number_energy_price: null,
+        },
+      ],
+      device_consumption: [
+        {
+          stat_consumption: "sensor.energy_car",
+          stat_rate: "sensor.power_car",
+        },
+        {
+          stat_consumption: "sensor.energy_ac",
+          stat_rate: "sensor.power_ac",
+        },
+        {
+          stat_consumption: "sensor.energy_washing_machine",
+          stat_rate: "sensor.power_washing_machine",
+        },
+        {
+          stat_consumption: "sensor.energy_dryer",
+          stat_rate: "sensor.power_dryer",
+        },
+        {
+          stat_consumption: "sensor.energy_heat_pump",
+          stat_rate: "sensor.power_heat_pump",
+        },
+        {
+          stat_consumption: "sensor.energy_boiler",
+          stat_rate: "sensor.power_boiler",
+        },
+      ],
+      device_consumption_water: [
+        {
+          stat_consumption: "sensor.water_kitchen",
+        },
+        {
+          stat_consumption: "sensor.water_garden",
+        },
+      ],
+    })
+  );
+  hass.mockWS(
+    "energy/info",
+    (): EnergyInfo => ({ cost_sensors: {}, solar_forecast_domains: [] })
+  );
   hass.mockWS(
     "energy/fossil_energy_consumption",
     ({ period }): FossilEnergyConsumption => ({
@@ -110,48 +113,51 @@ export const mockEnergy = (hass: MockHomeAssistant) => {
   );
   const todayString = format(startOfToday(), "yyyy-MM-dd");
   const tomorrowString = format(startOfTomorrow(), "yyyy-MM-dd");
-  hass.mockWS("energy/solar_forecast", (): EnergySolarForecasts => ({
-    solar_forecast: {
-      wh_hours: {
-        [`${todayString}T06:00:00`]: 0,
-        [`${todayString}T06:23:00`]: 6,
-        [`${todayString}T06:45:00`]: 39,
-        [`${todayString}T07:00:00`]: 28,
-        [`${todayString}T08:00:00`]: 208,
-        [`${todayString}T09:00:00`]: 352,
-        [`${todayString}T10:00:00`]: 544,
-        [`${todayString}T11:00:00`]: 748,
-        [`${todayString}T12:00:00`]: 1259,
-        [`${todayString}T13:00:00`]: 1361,
-        [`${todayString}T14:00:00`]: 1373,
-        [`${todayString}T15:00:00`]: 1370,
-        [`${todayString}T16:00:00`]: 1186,
-        [`${todayString}T17:00:00`]: 937,
-        [`${todayString}T18:00:00`]: 652,
-        [`${todayString}T19:00:00`]: 370,
-        [`${todayString}T20:00:00`]: 155,
-        [`${todayString}T21:48:00`]: 24,
-        [`${todayString}T22:36:00`]: 0,
-        [`${tomorrowString}T06:01:00`]: 0,
-        [`${tomorrowString}T06:23:00`]: 9,
-        [`${tomorrowString}T06:45:00`]: 47,
-        [`${tomorrowString}T07:00:00`]: 48,
-        [`${tomorrowString}T08:00:00`]: 473,
-        [`${tomorrowString}T09:00:00`]: 827,
-        [`${tomorrowString}T10:00:00`]: 1153,
-        [`${tomorrowString}T11:00:00`]: 1413,
-        [`${tomorrowString}T12:00:00`]: 1590,
-        [`${tomorrowString}T13:00:00`]: 1652,
-        [`${tomorrowString}T14:00:00`]: 1612,
-        [`${tomorrowString}T15:00:00`]: 1438,
-        [`${tomorrowString}T16:00:00`]: 1149,
-        [`${tomorrowString}T17:00:00`]: 830,
-        [`${tomorrowString}T18:00:00`]: 542,
-        [`${tomorrowString}T19:00:00`]: 311,
-        [`${tomorrowString}T20:00:00`]: 140,
-        [`${tomorrowString}T21:47:00`]: 22,
-        [`${tomorrowString}T22:34:00`]: 0,
+  hass.mockWS(
+    "energy/solar_forecast",
+    (): EnergySolarForecasts => ({
+      solar_forecast: {
+        wh_hours: {
+          [`${todayString}T06:00:00`]: 0,
+          [`${todayString}T06:23:00`]: 6,
+          [`${todayString}T06:45:00`]: 39,
+          [`${todayString}T07:00:00`]: 28,
+          [`${todayString}T08:00:00`]: 208,
+          [`${todayString}T09:00:00`]: 352,
+          [`${todayString}T10:00:00`]: 544,
+          [`${todayString}T11:00:00`]: 748,
+          [`${todayString}T12:00:00`]: 1259,
+          [`${todayString}T13:00:00`]: 1361,
+          [`${todayString}T14:00:00`]: 1373,
+          [`${todayString}T15:00:00`]: 1370,
+          [`${todayString}T16:00:00`]: 1186,
+          [`${todayString}T17:00:00`]: 937,
+          [`${todayString}T18:00:00`]: 652,
+          [`${todayString}T19:00:00`]: 370,
+          [`${todayString}T20:00:00`]: 155,
+          [`${todayString}T21:48:00`]: 24,
+          [`${todayString}T22:36:00`]: 0,
+          [`${tomorrowString}T06:01:00`]: 0,
+          [`${tomorrowString}T06:23:00`]: 9,
+          [`${tomorrowString}T06:45:00`]: 47,
+          [`${tomorrowString}T07:00:00`]: 48,
+          [`${tomorrowString}T08:00:00`]: 473,
+          [`${tomorrowString}T09:00:00`]: 827,
+          [`${tomorrowString}T10:00:00`]: 1153,
+          [`${tomorrowString}T11:00:00`]: 1413,
+          [`${tomorrowString}T12:00:00`]: 1590,
+          [`${tomorrowString}T13:00:00`]: 1652,
+          [`${tomorrowString}T14:00:00`]: 1612,
+          [`${tomorrowString}T15:00:00`]: 1438,
+          [`${tomorrowString}T16:00:00`]: 1149,
+          [`${tomorrowString}T17:00:00`]: 830,
+          [`${tomorrowString}T18:00:00`]: 542,
+          [`${tomorrowString}T19:00:00`]: 311,
+          [`${tomorrowString}T20:00:00`]: 140,
+          [`${tomorrowString}T21:47:00`]: 22,
+          [`${tomorrowString}T22:34:00`]: 0,
+        },
       },
-    },
-  }));
+    })
+  );
 };

demo/src/stubs/entity_sources.ts

@@ -2,8 +2,11 @@ import type { EntitySources } from "../../../src/data/entity/entity_sources";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockEntitySources = (hass: MockHomeAssistant) => {
-  hass.mockWS("entity/source", (): EntitySources => ({
-    "sensor.co2_intensity": { domain: "co2signal" },
-    "sensor.grid_fossil_fuel_percentage": { domain: "co2signal" },
-  }));
+  hass.mockWS(
+    "entity/source",
+    (): EntitySources => ({
+      "sensor.co2_intensity": { domain: "co2signal" },
+      "sensor.grid_fossil_fuel_percentage": { domain: "co2signal" },
+    })
+  );
 };

demo/src/stubs/frontend.ts

@@ -1,37 +1,10 @@
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
-import type { ThemeSettings } from "../../../src/types";
 
-let sidebarChangeCallback: ((data: { value: unknown }) => void) | undefined;
-let themeChangeCallback: ((data: { value: ThemeSettings }) => void) | undefined;
-
-const THEME_STORAGE_KEY = "demo_theme";
-const DEFAULT_THEME: ThemeSettings = { theme: "default", dark: false };
-
-export const getDemoTheme = (
-  fallback: ThemeSettings = DEFAULT_THEME
-): ThemeSettings => {
-  const storedTheme = localStorage.getItem(THEME_STORAGE_KEY);
-  if (!storedTheme) {
-    return fallback;
-  }
-  try {
-    return JSON.parse(storedTheme) as ThemeSettings;
-  } catch {
-    localStorage.removeItem(THEME_STORAGE_KEY);
-    return fallback;
-  }
-};
+let sidebarChangeCallback;
 
 export const mockFrontend = (hass: MockHomeAssistant) => {
-  hass.mockWS("frontend/get_user_data", ({ key }) => ({
-    value: key === "theme" ? getDemoTheme() : null,
-  }));
+  hass.mockWS("frontend/get_user_data", () => ({ value: null }));
   hass.mockWS("frontend/set_user_data", ({ key, value }) => {
-    if (key === "theme") {
-      localStorage.setItem(THEME_STORAGE_KEY, JSON.stringify(value));
-      themeChangeCallback?.({ value });
-      localStorage.removeItem("selectedTheme");
-    }
     if (key === "sidebar") {
       sidebarChangeCallback?.({
         value: {
@@ -41,18 +14,10 @@ export const mockFrontend = (hass: MockHomeAssistant) => {
       });
     }
   });
-  hass.mockWS("frontend/subscribe_user_data", (msg, currentHass, onChange) => {
+  hass.mockWS("frontend/subscribe_user_data", (msg, _hass, onChange) => {
     if (msg.key === "sidebar") {
       sidebarChangeCallback = onChange;
     }
-    if (msg.key === "theme") {
-      themeChangeCallback = onChange;
-      onChange?.({
-        value: getDemoTheme(currentHass.selectedTheme ?? undefined),
-      });
-      // eslint-disable-next-line @typescript-eslint/no-empty-function
-      return () => {};
-    }
     onChange?.({ value: null });
     // eslint-disable-next-line @typescript-eslint/no-empty-function
     return () => {};

demo/src/stubs/network.ts

@@ -2,9 +2,12 @@ import type { NetworkUrls } from "../../../src/data/network";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockNetwork = (hass: MockHomeAssistant) => {
-  hass.mockWS("network/url", (): NetworkUrls => ({
-    internal: "http://homeassistant.local:8123",
-    external: "https://demo-instance.ui.nabu.casa",
-    cloud: "https://demo-instance.ui.nabu.casa",
-  }));
+  hass.mockWS(
+    "network/url",
+    (): NetworkUrls => ({
+      internal: "http://homeassistant.local:8123",
+      external: "https://demo-instance.ui.nabu.casa",
+      cloud: "https://demo-instance.ui.nabu.casa",
+    })
+  );
 };

demo/src/stubs/translations.ts

@@ -1,7 +1,8 @@
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockTranslations = (hass: MockHomeAssistant) => {
-  hass.mockWS("frontend/get_translations", (
-    /* msg: {language: string, category: string} */
-  ) => ({ resources: {} }));
+  hass.mockWS(
+    "frontend/get_translations",
+    (/* msg: {language: string, category: string} */) => ({ resources: {} })
+  );
 };

gallery/script/develop_gallery

@@ -1,10 +1,9 @@
 #!/bin/sh
-# Run the gallery. Pass --background/--status/--stop/--logs to manage a
-# detached instance (see build-scripts/dev-server.mjs).
+# Run the gallery
 
 # Stop on errors
 set -e
 
 cd "$(dirname "$0")/../.."
 
-exec node build-scripts/dev-server.mjs --suite gallery "$@"
+./node_modules/.bin/gulp develop-gallery

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

@@ -101,11 +101,9 @@ class DemoBlackWhiteRow extends LitElement {
               </ha-button>
             </div>
           </ha-card>
-          ${
-            this.value
-              ? html`<pre>${JSON.stringify(this.value, undefined, 2)}</pre>`
-              : nothing
-          }
+          ${this.value
+            ? html`<pre>${JSON.stringify(this.value, undefined, 2)}</pre>`
+            : nothing}
         </section>
       </div>
     `;

gallery/src/components/demo-card.ts

@@ -34,11 +34,9 @@ class DemoCard extends LitElement {
     return html`
       <h2>
         ${this.config.heading}
-        ${
-          this._size !== undefined
-            ? html`<small>(size ${this._size})</small>`
-            : ""
-        }
+        ${this._size !== undefined
+          ? html`<small>(size ${this._size})</small>`
+          : ""}
       </h2>
       <div class="root">
         <hui-card
@@ -46,11 +44,9 @@ class DemoCard extends LitElement {
           .hass=${this.hass}
           @card-updated=${this._cardUpdated}
         ></hui-card>
-        ${
-          this.showConfig
-            ? html`<pre>${this.config.config.trim()}</pre>`
-            : nothing
-        }
+        ${this.showConfig
+          ? html`<pre>${this.config.config.trim()}</pre>`
+          : nothing}
       </div>
     `;
   }

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

@@ -22,15 +22,13 @@ class DemoMoreInfo extends LitElement {
       <div class="root">
         <div id="card">
           <ha-card>
-            ${
-              !computeShowNewMoreInfo(state)
-                ? html`<state-card-content
-                    .stateObj=${state}
-                    .hass=${this.hass}
-                    in-dialog
-                  ></state-card-content>`
-                : nothing
-            }
+            ${!computeShowNewMoreInfo(state)
+              ? html`<state-card-content
+                  .stateObj=${state}
+                  .hass=${this.hass}
+                  in-dialog
+                ></state-card-content>`
+              : nothing}
 
             <more-info-content
               .hass=${this.hass}

gallery/src/ha-gallery.ts

@@ -211,46 +211,38 @@ class HaGallery extends LitElement {
         </ha-sidebar>
         <div slot="appContent" class="app-content">
           <ha-top-app-bar-fixed .narrow=${this._narrow}>
-            ${
-              this._narrow || !this._drawerOpen
-                ? html`<ha-icon-button
-                    slot="navigationIcon"
-                    @click=${this._toggleDrawer}
-                    .path=${mdiMenu}
-                  ></ha-icon-button>`
-                : nothing
-            }
+            ${this._narrow || !this._drawerOpen
+              ? html`<ha-icon-button
+                  slot="navigationIcon"
+                  @click=${this._toggleDrawer}
+                  .path=${mdiMenu}
+                ></ha-icon-button>`
+              : nothing}
 
             <div slot="title">
-              ${
-                isSettingsPage
-                  ? "Settings"
-                  : page?.metadata.title || this._page.split("/")[1]
-              }
+              ${isSettingsPage
+                ? "Settings"
+                : page?.metadata.title || this._page.split("/")[1]}
             </div>
             <div class="content">
-              ${
-                isSettingsPage
-                  ? html`<gallery-settings
-                      .hass=${this._galleryHass}
-                      .themeSettings=${this._themeSettings}
-                      .narrow=${this._narrow}
-                      .rtl=${this._rtl}
-                      @theme-settings-changed=${this._themeSettingsChanged}
-                      @gallery-rtl-changed=${this._rtlChanged}
-                    ></gallery-settings>`
-                  : html`
-                      ${
-                        page?.description
-                          ? html`
-                              <page-description .page=${this._page}>
-                              </page-description>
-                            `
-                          : nothing
-                      }
-                      ${dynamicElement(`demo-${this._page.replace("/", "-")}`)}
-                    `
-              }
+              ${isSettingsPage
+                ? html`<gallery-settings
+                    .hass=${this._galleryHass}
+                    .themeSettings=${this._themeSettings}
+                    .narrow=${this._narrow}
+                    .rtl=${this._rtl}
+                    @theme-settings-changed=${this._themeSettingsChanged}
+                    @gallery-rtl-changed=${this._rtlChanged}
+                  ></gallery-settings>`
+                : html`
+                    ${page?.description
+                      ? html`
+                          <page-description .page=${this._page}>
+                          </page-description>
+                        `
+                      : nothing}
+                    ${dynamicElement(`demo-${this._page.replace("/", "-")}`)}
+                  `}
             </div>
             ${isSettingsPage || !page ? nothing : this._renderPageFooter(page)}
           </ha-top-app-bar-fixed>
@@ -398,15 +390,13 @@ class HaGallery extends LitElement {
                 .header=${group.header}
                 ?expanded=${expanded}
               >
-                ${
-                  group.icon
-                    ? html`<ha-svg-icon
-                        slot="leading-icon"
-                        class="gallery-sidebar-icon"
-                        .path=${group.icon}
-                      ></ha-svg-icon>`
-                    : nothing
-                }
+                ${group.icon
+                  ? html`<ha-svg-icon
+                      slot="leading-icon"
+                      class="gallery-sidebar-icon"
+                      .path=${group.icon}
+                    ></ha-svg-icon>`
+                  : nothing}
                 ${content}
               </ha-expansion-panel>
             `
@@ -464,11 +454,9 @@ class HaGallery extends LitElement {
         ?selected=${this._page === page}
         href=${`#${page}`}
       >
-        ${
-          iconPath
-            ? html`<ha-svg-icon slot="start" .path=${iconPath}></ha-svg-icon>`
-            : nothing
-        }
+        ${iconPath
+          ? html`<ha-svg-icon slot="start" .path=${iconPath}></ha-svg-icon>`
+          : nothing}
         <span slot="headline">${title}</span>
       </ha-list-item-button>
     `;
@@ -499,30 +487,23 @@ class HaGallery extends LitElement {
           Suggest an edit to this page, or provide/view feedback for this page.
         </div>
         <div>
-          ${
-            page.description || Object.keys(page.metadata).length > 0
-              ? html`
-                  <a
-                    href=${`${GITHUB_DEMO_URL}${this._page}.markdown`}
-                    target="_blank"
-                  >
-                    Edit text
-                  </a>
-                `
-              : nothing
-          }
-          ${
-            page.demo
-              ? html`
-                  <a
-                    href=${`${GITHUB_DEMO_URL}${this._page}.ts`}
-                    target="_blank"
-                  >
-                    Edit demo
-                  </a>
-                `
-              : nothing
-          }
+          ${page.description || Object.keys(page.metadata).length > 0
+            ? html`
+                <a
+                  href=${`${GITHUB_DEMO_URL}${this._page}.markdown`}
+                  target="_blank"
+                >
+                  Edit text
+                </a>
+              `
+            : nothing}
+          ${page.demo
+            ? html`
+                <a href=${`${GITHUB_DEMO_URL}${this._page}.ts`} target="_blank">
+                  Edit demo
+                </a>
+              `
+            : nothing}
         </div>
       </div>
     </div>`;

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

@@ -149,11 +149,9 @@ export class DemoAutomationDescribeAction extends LitElement {
       <ha-card header="Actions">
         <div class="action">
           <span>
-            ${
-              this._action
-                ? describeAction(this.hass, [], this._action)
-                : "<invalid YAML>"
-            }
+            ${this._action
+              ? describeAction(this.hass, [], this._action)
+              : "<invalid YAML>"}
           </span>
           <ha-yaml-editor
             label="Action Config"

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

@@ -74,11 +74,9 @@ export class DemoAutomationDescribeCondition extends LitElement {
       <ha-card header="Conditions">
         <div class="condition">
           <span>
-            ${
-              this._condition
-                ? describeCondition(this._condition, this.hass, [])
-                : "<invalid YAML>"
-            }
+            ${this._condition
+              ? describeCondition(this._condition, this.hass, [])
+              : "<invalid YAML>"}
           </span>
           <ha-yaml-editor
             label="Condition Config"

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

@@ -98,11 +98,9 @@ export class DemoAutomationDescribeTrigger extends LitElement {
       <ha-card header="Triggers">
         <div class="trigger">
           <span>
-            ${
-              this._trigger
-                ? describeTrigger(this._trigger, this.hass, [])
-                : "<invalid YAML>"
-            }
+            ${this._trigger
+              ? describeTrigger(this._trigger, this.hass, [])
+              : "<invalid YAML>"}
           </span>
           <ha-yaml-editor
             label="Trigger Config"

gallery/src/pages/automation/trace.ts

@@ -54,18 +54,16 @@ export class DemoAutomationTrace extends LitElement {
                 @value-changed=${this._handleTimelineValueChanged}
                 .sampleIdx=${idx}
               ></hat-trace-timeline>
-              ${
-                selectedNode && graph
-                  ? html`<ha-trace-path-details
-                      .hass=${this.hass}
-                      .trace=${trace.trace}
-                      .selected=${selectedNode}
-                      .logbookEntries=${trace.logbookEntries}
-                      .trackedNodes=${graph.trackedNodes}
-                      .renderedNodes=${graph.renderedNodes}
-                    ></ha-trace-path-details>`
-                  : nothing
-              }
+              ${selectedNode && graph
+                ? html`<ha-trace-path-details
+                    .hass=${this.hass}
+                    .trace=${trace.trace}
+                    .selected=${selectedNode}
+                    .logbookEntries=${trace.logbookEntries}
+                    .trackedNodes=${graph.trackedNodes}
+                    .renderedNodes=${graph.renderedNodes}
+                  ></ha-trace-path-details>`
+                : nothing}
               <button @click=${() => console.log(trace)}>Log trace</button>
             </div>
           </ha-card>

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

@@ -33,24 +33,20 @@ export class DemoHaChips extends LitElement {
             ${chips.map(
               (chip) => html`
                 <ha-assist-chip .label=${chip.content}>
-                  ${
-                    chip.icon
-                      ? html`<ha-svg-icon slot="icon" .path=${chip.icon}>
-                        </ha-svg-icon>`
-                      : nothing
-                  }
+                  ${chip.icon
+                    ? html`<ha-svg-icon slot="icon" .path=${chip.icon}>
+                      </ha-svg-icon>`
+                    : nothing}
                 </ha-assist-chip>
               `
             )}
             ${chips.map(
               (chip) => html`
                 <ha-assist-chip .label=${chip.content} selected>
-                  ${
-                    chip.icon
-                      ? html`<ha-svg-icon slot="icon" .path=${chip.icon}>
-                        </ha-svg-icon>`
-                      : nothing
-                  }
+                  ${chip.icon
+                    ? html`<ha-svg-icon slot="icon" .path=${chip.icon}>
+                      </ha-svg-icon>`
+                    : nothing}
                 </ha-assist-chip>
               `
             )}
@@ -60,24 +56,20 @@ export class DemoHaChips extends LitElement {
             ${chips.map(
               (chip) => html`
                 <ha-filter-chip .label=${chip.content}>
-                  ${
-                    chip.icon
-                      ? html`<ha-svg-icon slot="icon" .path=${chip.icon}>
-                        </ha-svg-icon>`
-                      : nothing
-                  }
+                  ${chip.icon
+                    ? html`<ha-svg-icon slot="icon" .path=${chip.icon}>
+                      </ha-svg-icon>`
+                    : nothing}
                 </ha-filter-chip>
               `
             )}
             ${chips.map(
               (chip) => html`
                 <ha-filter-chip .label=${chip.content} selected>
-                  ${
-                    chip.icon
-                      ? html`<ha-svg-icon slot="icon" .path=${chip.icon}>
-                        </ha-svg-icon>`
-                      : nothing
-                  }
+                  ${chip.icon
+                    ? html`<ha-svg-icon slot="icon" .path=${chip.icon}>
+                      </ha-svg-icon>`
+                    : nothing}
                 </ha-filter-chip>
               `
             )}
@@ -87,12 +79,10 @@ export class DemoHaChips extends LitElement {
             ${chips.map(
               (chip) => html`
                 <ha-input-chip .label=${chip.content}>
-                  ${
-                    chip.icon
-                      ? html`<ha-svg-icon slot="icon" .path=${chip.icon}>
-                        </ha-svg-icon>`
-                      : nothing
-                  }
+                  ${chip.icon
+                    ? html`<ha-svg-icon slot="icon" .path=${chip.icon}>
+                      </ha-svg-icon>`
+                    : nothing}
                   ${chip.content}
                 </ha-input-chip>
               `
@@ -100,12 +90,10 @@ export class DemoHaChips extends LitElement {
             ${chips.map(
               (chip) => html`
                 <ha-input-chip .label=${chip.content} selected>
-                  ${
-                    chip.icon
-                      ? html`<ha-svg-icon slot="icon" .path=${chip.icon}>
-                        </ha-svg-icon>`
-                      : nothing
-                  }
+                  ${chip.icon
+                    ? html`<ha-svg-icon slot="icon" .path=${chip.icon}>
+                      </ha-svg-icon>`
+                    : nothing}
                 </ha-input-chip>
               `
             )}

gallery/src/pages/components/ha-control-select-menu.ts

@@ -92,16 +92,14 @@ export class DemoHaControlSelectMenu extends LitElement {
                       .value=${option.value}
                       .graphic=${option.icon ? "icon" : undefined}
                     >
-                      ${
-                        option.icon
-                          ? html`
-                              <ha-svg-icon
-                                slot="graphic"
-                                .path=${option.icon}
-                              ></ha-svg-icon>
-                            `
-                          : nothing
-                      }
+                      ${option.icon
+                        ? html`
+                            <ha-svg-icon
+                              slot="graphic"
+                              .path=${option.icon}
+                            ></ha-svg-icon>
+                          `
+                        : nothing}
                       ${option.label ?? option.value}
                     </ha-list-item>
                   `

gallery/src/pages/components/ha-label-badge.ts

@@ -60,9 +60,9 @@ export class DemoHaLabelBadge extends LitElement {
           ${badges.map(
             (badge) => html`
               <ha-label-badge
-                style="--ha-label-badge-color: ${
-                  colors[Math.floor(Math.random() * colors.length)]
-                }"
+                style="--ha-label-badge-color: ${colors[
+                  Math.floor(Math.random() * colors.length)
+                ]}"
                 .label=${badge.label}
                 .description=${badge.description}
                 .image=${badge.image}
@@ -78,9 +78,9 @@ export class DemoHaLabelBadge extends LitElement {
             (badge) => html`
               <div class="badge">
                 <ha-label-badge
-                  style="--ha-label-badge-color: ${
-                    colors[Math.floor(Math.random() * colors.length)]
-                  }"
+                  style="--ha-label-badge-color: ${colors[
+                    Math.floor(Math.random() * colors.length)
+                  ]}"
                   .label=${badge.label}
                   .description=${badge.description}
                   .image=${badge.image}

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

@@ -244,7 +244,8 @@ export class DemoHaList extends LitElement {
           )}
         </ha-list-selectable>
         <pre>
-selected: ${JSON.stringify(this._toJson(this._multiCheckStart))}</pre>
+selected: ${JSON.stringify(this._toJson(this._multiCheckStart))}</pre
+        >
       </ha-card>
 
       <ha-card
@@ -271,7 +272,8 @@ selected: ${JSON.stringify(this._toJson(this._multiCheckStart))}</pre>
           )}
         </ha-list-selectable>
         <pre>
-selected: ${JSON.stringify(this._toJson(this._multiCheckEnd))}</pre>
+selected: ${JSON.stringify(this._toJson(this._multiCheckEnd))}</pre
+        >
       </ha-card>
 
       <ha-card header="Option: all combinations">

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

@@ -696,13 +696,11 @@ class DemoHaSelector extends LitElement implements ProvideHassElement {
                 ([key, value]) => html`
                   <ha-settings-row narrow slot=${slot}>
                     <span slot="heading">${value?.name || key}</span>
-                    ${
-                      value?.description
-                        ? html`<span slot="description"
-                            >${value?.description}</span
-                          >`
-                        : nothing
-                    }
+                    ${value?.description
+                      ? html`<span slot="description"
+                          >${value?.description}</span
+                        >`
+                      : nothing}
                     <ha-selector
                       .hass=${this.hass}
                       .selector=${value!.selector}

landing-page/src/components/landing-page-logs.ts

@@ -65,34 +65,30 @@ class LandingPageLogs extends LitElement {
         <ha-button appearance="plain" @click=${this._toggleLogDetails}>
           ${this.localize(this._show ? "hide_details" : "show_details")}
         </ha-button>
-        ${
-          this._show
-            ? html`<ha-icon-button
-                .label=${this.localize("logs.download_logs")}
-                .path=${mdiDownload}
-                @click=${this._downloadLogs}
-              ></ha-icon-button>`
-            : nothing
-        }
+        ${this._show
+          ? html`<ha-icon-button
+              .label=${this.localize("logs.download_logs")}
+              .path=${mdiDownload}
+              @click=${this._downloadLogs}
+            ></ha-icon-button>`
+          : nothing}
       </div>
-      ${
-        this._error
-          ? html`
-              <ha-alert
-                alert-type="error"
-                .title=${this.localize("logs.fetch_error")}
+      ${this._error
+        ? html`
+            <ha-alert
+              alert-type="error"
+              .title=${this.localize("logs.fetch_error")}
+            >
+              <ha-button
+                size="small"
+                variant="danger"
+                @click=${this._startLogStream}
               >
-                <ha-button
-                  size="small"
-                  variant="danger"
-                  @click=${this._startLogStream}
-                >
-                  ${this.localize("logs.retry")}
-                </ha-button>
-              </ha-alert>
-            `
-          : nothing
-      }
+                ${this.localize("logs.retry")}
+              </ha-button>
+            </ha-alert>
+          `
+        : nothing}
       <div
         class=${classMap({
           logs: true,

landing-page/src/components/landing-page-network.ts

@@ -55,15 +55,13 @@ class LandingPageNetwork extends LitElement {
           })}
         </p>
         <p>${this.localize("network_issue.resolve_different")}</p>
-        ${
-          !dnsPrimaryInterfaceNameservers
-            ? html`
-                <p>
-                  <b>${this.localize("network_issue.no_primary_interface")} </b>
-                </p>
-              `
-            : nothing
-        }
+        ${!dnsPrimaryInterfaceNameservers
+          ? html`
+              <p>
+                <b>${this.localize("network_issue.no_primary_interface")} </b>
+              </p>
+            `
+          : nothing}
         <div class="actions">
           ${ALTERNATIVE_DNS_SERVERS.map(
             ({ translationKey }, key) =>

landing-page/src/ha-landing-page.ts

@@ -61,47 +61,39 @@ class HaLandingPage extends LandingPageBaseElement {
       <ha-card>
         <div class="card-content">
           <h1>${this.localize("header")}</h1>
-          ${
-            !networkIssue && !this._supervisorError
-              ? html`
-                  <p>${this.localize("subheader")}</p>
-                  <ha-progress-bar
-                    .indeterminate=${this._progress <= 0}
-                    .value=${this._progress > 0 ? this._progress : undefined}
-                    .loading=${this._progress >= 0}
-                    >${
-                      this._progress > 0
-                        ? `${Math.round(this._progress)}%`
-                        : nothing
-                    }</ha-progress-bar
-                  >
-                `
-              : nothing
-          }
-          ${
-            networkIssue || this._networkInfoError
-              ? html`
-                  <landing-page-network
-                    .localize=${this.localize}
-                    .networkInfo=${this._networkInfo}
-                    .error=${this._networkInfoError}
-                    @dns-set=${this._fetchSupervisorInfo}
-                  ></landing-page-network>
-                `
-              : nothing
-          }
-          ${
-            this._supervisorError
-              ? html`
-                  <ha-alert
-                    alert-type="error"
-                    .title=${this.localize("error_title")}
-                  >
-                    ${this.localize("error_description")}
-                  </ha-alert>
-                `
-              : nothing
-          }
+          ${!networkIssue && !this._supervisorError
+            ? html`
+                <p>${this.localize("subheader")}</p>
+                <ha-progress-bar
+                  .indeterminate=${this._progress <= 0}
+                  .value=${this._progress > 0 ? this._progress : undefined}
+                  .loading=${this._progress >= 0}
+                  >${this._progress > 0
+                    ? `${Math.round(this._progress)}%`
+                    : nothing}</ha-progress-bar
+                >
+              `
+            : nothing}
+          ${networkIssue || this._networkInfoError
+            ? html`
+                <landing-page-network
+                  .localize=${this.localize}
+                  .networkInfo=${this._networkInfo}
+                  .error=${this._networkInfoError}
+                  @dns-set=${this._fetchSupervisorInfo}
+                ></landing-page-network>
+              `
+            : nothing}
+          ${this._supervisorError
+            ? html`
+                <ha-alert
+                  alert-type="error"
+                  .title=${this.localize("error_title")}
+                >
+                  ${this.localize("error_description")}
+                </ha-alert>
+              `
+            : nothing}
           <landing-page-logs
             .localize=${this.localize}
             @landing-page-error=${this._showError}

package.json

@@ -12,7 +12,7 @@
     "format:eslint": "eslint \"**/src/**/*.{js,ts,html}\" --cache --cache-strategy=content --cache-location=node_modules/.cache/eslint/.eslintcache --ignore-pattern=.gitignore --fix",
     "lint:prettier": "prettier . --cache --check",
     "format:prettier": "prettier . --cache --write",
-    "lint:types": "node ./node_modules/@typescript/native/bin/tsc",
+    "lint:types": "tsc",
     "lint:lit": "lit-analyzer \"{.,*}/src/**/*.ts\"",
     "lint:licenses": "node --no-deprecation script/check-licenses",
     "lint": "yarn run lint:eslint && yarn run lint:prettier && yarn run lint:types && yarn run lint:lit",
@@ -24,10 +24,6 @@
     "test:bench": "vitest bench --run --config test/vitest.bench.config.ts",
     "test:coverage": "vitest run --config test/vitest.config.ts --coverage",
     "check-bundlesize": "node build-scripts/check-bundle-size.cjs",
-    "dev": "node build-scripts/dev-server.mjs --suite app",
-    "dev:serve": "node build-scripts/dev-server.mjs --suite app-serve",
-    "dev:demo": "demo/script/develop_demo",
-    "dev:gallery": "gallery/script/develop_gallery",
     "test:e2e": "node test/e2e/run-suites.mjs demo app gallery",
     "test:e2e:show-report": "yarn playwright show-report test/e2e/reports/combined",
     "test:e2e:demo": "playwright test --config test/e2e/playwright.demo.config.ts",
@@ -48,19 +44,19 @@
     "@codemirror/language": "6.12.4",
     "@codemirror/lint": "6.9.7",
     "@codemirror/search": "6.7.1",
-    "@codemirror/state": "6.7.1",
-    "@codemirror/view": "6.43.6",
+    "@codemirror/state": "6.7.0",
+    "@codemirror/view": "6.43.3",
     "@date-fns/tz": "1.5.0",
     "@egjs/hammerjs": "2.0.17",
-    "@formatjs/intl-datetimeformat": "7.5.2",
-    "@formatjs/intl-displaynames": "7.3.13",
-    "@formatjs/intl-durationformat": "0.10.18",
-    "@formatjs/intl-getcanonicallocales": "3.2.11",
-    "@formatjs/intl-listformat": "8.3.13",
-    "@formatjs/intl-locale": "5.3.10",
-    "@formatjs/intl-numberformat": "9.3.14",
-    "@formatjs/intl-pluralrules": "6.3.13",
-    "@formatjs/intl-relativetimeformat": "12.3.13",
+    "@formatjs/intl-datetimeformat": "7.4.9",
+    "@formatjs/intl-displaynames": "7.3.10",
+    "@formatjs/intl-durationformat": "0.10.15",
+    "@formatjs/intl-getcanonicallocales": "3.2.10",
+    "@formatjs/intl-listformat": "8.3.10",
+    "@formatjs/intl-locale": "5.3.9",
+    "@formatjs/intl-numberformat": "9.3.11",
+    "@formatjs/intl-pluralrules": "6.3.10",
+    "@formatjs/intl-relativetimeformat": "12.3.10",
     "@fullcalendar/core": "6.1.21",
     "@fullcalendar/daygrid": "6.1.21",
     "@fullcalendar/interaction": "6.1.21",
@@ -77,19 +73,19 @@
     "@lit/task": "1.0.3",
     "@material/mwc-formfield": "patch:@material/mwc-formfield@npm%3A0.27.0#~/.yarn/patches/@material-mwc-formfield-npm-0.27.0-9528cb60f6.patch",
     "@material/mwc-list": "patch:@material/mwc-list@npm%3A0.27.0#~/.yarn/patches/@material-mwc-list-npm-0.27.0-5344fc9de4.patch",
-    "@material/web": "2.5.0",
+    "@material/web": "2.4.1",
     "@mdi/js": "7.4.47",
     "@mdi/svg": "7.4.47",
     "@replit/codemirror-indentation-markers": "6.5.3",
     "@swc/helpers": "0.5.23",
     "@thomasloven/round-slider": "0.6.0",
-    "@tsparticles/engine": "4.3.2",
-    "@tsparticles/preset-links": "4.3.2",
+    "@tsparticles/engine": "4.2.1",
+    "@tsparticles/preset-links": "4.2.1",
     "@vibrant/color": "4.0.4",
     "@vvo/tzdb": "6.198.0",
     "@webcomponents/scoped-custom-element-registry": "0.0.10",
     "@webcomponents/webcomponentsjs": "2.8.0",
-    "barcode-detector": "3.2.1",
+    "barcode-detector": "3.2.0",
     "cally": "0.9.2",
     "color-name": "2.1.0",
     "comlink": "4.4.2",
@@ -102,20 +98,20 @@
     "dialog-polyfill": "0.5.6",
     "echarts": "6.1.0",
     "element-internals-polyfill": "3.0.2",
-    "fuse.js": "7.5.0",
+    "fuse.js": "7.4.2",
     "gulp-zopfli-green": "7.0.0",
     "hls.js": "1.6.16",
     "home-assistant-js-websocket": "9.6.0",
-    "idb-keyval": "6.3.0",
-    "intl-messageformat": "11.2.12",
-    "js-yaml": "5.2.1",
+    "idb-keyval": "6.2.5",
+    "intl-messageformat": "11.2.9",
+    "js-yaml": "5.1.0",
     "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",
     "lit": "3.3.3",
     "lit-html": "3.3.3",
     "luxon": "3.7.2",
-    "marked": "18.0.6",
+    "marked": "18.0.5",
     "memoize-one": "6.0.0",
     "node-vibrant": "4.0.4",
     "object-hash": "3.0.0",
@@ -145,14 +141,14 @@
     "@babel/preset-env": "8.0.2",
     "@bundle-stats/plugin-webpack-filter": "4.22.2",
     "@eslint/js": "10.0.1",
-    "@html-eslint/eslint-plugin": "0.64.0",
-    "@lokalise/node-api": "16.3.0",
+    "@html-eslint/eslint-plugin": "0.62.0",
+    "@lokalise/node-api": "16.0.0",
     "@octokit/auth-oauth-device": "8.0.3",
     "@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.5.16",
+    "@rspack/core": "2.0.8",
     "@rspack/dev-server": "2.1.0",
     "@types/babel__plugin-transform-runtime": "7.9.5",
     "@types/chromecast-caf-receiver": "6.0.26",
@@ -168,22 +164,21 @@
     "@types/qrcode": "1.5.6",
     "@types/sortablejs": "1.15.9",
     "@types/tar": "7.0.87",
-    "@typescript/native": "npm:typescript@7.0.2",
-    "@vitest/coverage-v8": "4.1.10",
+    "@vitest/coverage-v8": "4.1.9",
     "babel-loader": "10.1.1",
     "babel-plugin-polyfill-corejs3": "1.0.0",
     "browserslist-useragent-regexp": "4.1.4",
     "del": "8.0.1",
-    "eslint": "10.7.0",
+    "eslint": "10.5.0",
     "eslint-config-prettier": "10.1.8",
     "eslint-import-resolver-webpack": "0.13.11",
-    "eslint-plugin-import-x": "4.17.1",
+    "eslint-plugin-import-x": "4.17.0",
     "eslint-plugin-lit": "2.3.1",
     "eslint-plugin-lit-a11y": "5.1.1",
     "eslint-plugin-unused-imports": "4.4.1",
     "eslint-plugin-wc": "3.1.0",
     "fancy-log": "2.0.0",
-    "fs-extra": "11.3.6",
+    "fs-extra": "11.3.5",
     "generate-license-file": "4.2.1",
     "glob": "13.0.6",
     "globals": "17.7.0",
@@ -196,24 +191,24 @@
     "jsdom": "29.1.1",
     "jszip": "3.10.1",
     "license-checker-rseidelsohn": "5.0.1",
-    "lint-staged": "17.1.0",
+    "lint-staged": "17.0.8",
     "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",
+    "minify-literals": "2.0.2",
     "pinst": "3.0.0",
-    "prettier": "3.9.5",
+    "prettier": "3.8.4",
     "rspack-manifest-plugin": "5.2.2",
     "serve": "14.2.6",
     "sinon": "22.0.0",
-    "tar": "7.5.20",
+    "tar": "7.5.17",
     "terser-webpack-plugin": "5.6.1",
     "ts-lit-plugin": "2.0.2",
     "typescript": "6.0.3",
-    "typescript-eslint": "8.64.0",
+    "typescript-eslint": "8.62.0",
     "vite-tsconfig-paths": "6.1.1",
-    "vitest": "4.1.10",
+    "vitest": "4.1.9",
     "webpack-stats-plugin": "1.1.3",
     "webpackbar": "7.0.0",
     "workbox-build": "patch:workbox-build@npm%3A7.4.1#~/.yarn/patches/workbox-build-npm-7.4.1-c84561662c.patch"
@@ -229,7 +224,7 @@
     "@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"
   },
-  "packageManager": "yarn@4.17.1",
+  "packageManager": "yarn@4.17.0",
   "volta": {
     "node": "24.18.0"
   }

renovate.json

@@ -11,7 +11,7 @@
     "group:recommended",
     "security:minimumReleaseAgeNpm"
   ],
-  "enabledManagers": ["npm", "nvm", "custom.regex"],
+  "enabledManagers": ["npm", "nvm"],
   "postUpdateOptions": ["yarnDedupeHighest"],
   "lockFileMaintenance": {
     "description": ["Run after patch releases but before next beta"],
@@ -49,26 +49,6 @@
       "datasourceTemplate": "custom.ha-core-python",
       "versioningTemplate": "python",
       "extractVersionTemplate": "^(?<version>\\d+\\.\\d+)"
-    },
-    {
-      "description": "Keep actionlint used in CI up to date",
-      "customType": "regex",
-      "managerFilePatterns": ["/^\\.github/workflows/actionlint\\.yaml$/"],
-      "matchStrings": ["ACTIONLINT_VERSION: (?<currentValue>\\S+)"],
-      "depNameTemplate": "rhysd/actionlint",
-      "datasourceTemplate": "github-releases",
-      "extractVersionTemplate": "^v(?<version>.+)$"
-    },
-    {
-      "description": "Keep Playwright CI container image up to date",
-      "customType": "regex",
-      "managerFilePatterns": ["/^\\.github/workflows/e2e\\.yaml$/"],
-      "matchStrings": [
-        "mcr\\.microsoft\\.com/playwright:(?<currentValue>v\\d+\\.\\d+\\.\\d+-noble)"
-      ],
-      "depNameTemplate": "mcr.microsoft.com/playwright",
-      "datasourceTemplate": "docker",
-      "versioningTemplate": "regex:^v(?<major>\\d+)\\.(?<minor>\\d+)\\.(?<patch>\\d+)-(?<compatibility>noble)$"
     }
   ],
   "packageRules": [
@@ -97,16 +77,6 @@
       "description": "Group date-fns with dependent timezone package",
       "groupName": "date-fns",
       "matchPackageNames": ["date-fns", "date-fns-tz"]
-    },
-    {
-      "description": "Group formatjs monorepo package",
-      "groupName": "formatjs",
-      "matchPackageNames": ["@formatjs/**"]
-    },
-    {
-      "description": "Group Playwright package and CI container updates",
-      "groupName": "Playwright",
-      "matchPackageNames": ["@playwright/test", "mcr.microsoft.com/playwright"]
     }
   ]
 }

src/auth/ha-auth-flow.ts

@@ -182,11 +182,9 @@ export class HaAuthFlow extends LitElement {
               @click=${this._handleSubmit}
               .loading=${this._submitting}
             >
-              ${
-                this.step.type === "form"
-                  ? this.localize("ui.panel.page-authorize.form.next")
-                  : this.localize("ui.panel.page-authorize.form.start_over")
-              }
+              ${this.step.type === "form"
+                ? this.localize("ui.panel.page-authorize.form.next")
+                : this.localize("ui.panel.page-authorize.form.start_over")}
             </ha-button>
           </div>
         `;
@@ -226,11 +224,9 @@ export class HaAuthFlow extends LitElement {
       case "form":
         return html`
           <h1>
-            ${
-              !["select_mfa_module", "mfa"].includes(step.step_id)
-                ? this.localize("ui.panel.page-authorize.welcome_home")
-                : this.localize("ui.panel.page-authorize.just_checking")
-            }
+            ${!["select_mfa_module", "mfa"].includes(step.step_id)
+              ? this.localize("ui.panel.page-authorize.welcome_home")
+              : this.localize("ui.panel.page-authorize.just_checking")}
           </h1>
           ${this._computeStepDescription(step)}
           ${keyed(
@@ -248,19 +244,17 @@ export class HaAuthFlow extends LitElement {
           )}
 
           <div class="space-between">
-            ${
-              this.clientId === genClientId() &&
-              !["select_mfa_module", "mfa"].includes(step.step_id)
-                ? html`
-                    <ha-checkbox
-                      .checked=${this._storeToken}
-                      @change=${this._storeTokenChanged}
-                    >
-                      ${this.localize("ui.panel.page-authorize.store_token")}
-                    </ha-checkbox>
-                  `
-                : ""
-            }
+            ${this.clientId === genClientId() &&
+            !["select_mfa_module", "mfa"].includes(step.step_id)
+              ? html`
+                  <ha-checkbox
+                    .checked=${this._storeToken}
+                    @change=${this._storeTokenChanged}
+                  >
+                    ${this.localize("ui.panel.page-authorize.store_token")}
+                  </ha-checkbox>
+                `
+              : ""}
             <a
               class="forgot-password"
               href="https://www.home-assistant.io/docs/locked_out/#forgot-password"

src/auth/ha-authorize.ts

@@ -147,58 +147,45 @@ export class HaAuthorize extends litLocalizeLiteMixin(LitElement) {
         }
       </style>
 
-      ${
-        !this._ownInstance
-          ? html`<ha-alert .alertType=${app ? "info" : "warning"}>
-              ${
-                app
-                  ? this.localize("ui.panel.page-authorize.authorizing_app", {
-                      app: appNames[this.clientId!],
-                    })
-                  : this.localize(
-                      "ui.panel.page-authorize.authorizing_client",
-                      {
-                        clientId: html`<b
-                          >${
-                            this.clientId
-                              ? punycode.toASCII(this.clientId)
-                              : this.clientId
-                          }</b
-                        >`,
-                      }
-                    )
-              }
-            </ha-alert>`
-          : nothing
-      }
+      ${!this._ownInstance
+        ? html`<ha-alert .alertType=${app ? "info" : "warning"}>
+            ${app
+              ? this.localize("ui.panel.page-authorize.authorizing_app", {
+                  app: appNames[this.clientId!],
+                })
+              : this.localize("ui.panel.page-authorize.authorizing_client", {
+                  clientId: html`<b
+                    >${this.clientId
+                      ? punycode.toASCII(this.clientId)
+                      : this.clientId}</b
+                  >`,
+                })}
+          </ha-alert>`
+        : nothing}
 
       <div class="card-content">
-        ${
-          !this._authProvider
-            ? html`<p>
-                ${this.localize("ui.panel.page-authorize.initializing")}
-              </p> `
-            : html`<ha-auth-flow
-                  .clientId=${this.clientId}
-                  .redirectUri=${this.redirectUri}
-                  .oauth2State=${this.oauth2State}
-                  .authProvider=${this._authProvider}
-                  .localize=${this.localize}
-                  .initStoreToken=${this._preselectStoreToken}
-                ></ha-auth-flow>
-                ${
-                  inactiveProviders!.length > 0
-                    ? html`
-                        <ha-pick-auth-provider
-                          .localize=${this.localize}
-                          .clientId=${this.clientId}
-                          .authProviders=${inactiveProviders!}
-                          @pick-auth-provider=${this._handleAuthProviderPick}
-                        ></ha-pick-auth-provider>
-                      `
-                    : ""
-                }`
-        }
+        ${!this._authProvider
+          ? html`<p>
+              ${this.localize("ui.panel.page-authorize.initializing")}
+            </p> `
+          : html`<ha-auth-flow
+                .clientId=${this.clientId}
+                .redirectUri=${this.redirectUri}
+                .oauth2State=${this.oauth2State}
+                .authProvider=${this._authProvider}
+                .localize=${this.localize}
+                .initStoreToken=${this._preselectStoreToken}
+              ></ha-auth-flow>
+              ${inactiveProviders!.length > 0
+                ? html`
+                    <ha-pick-auth-provider
+                      .localize=${this.localize}
+                      .clientId=${this.clientId}
+                      .authProviders=${inactiveProviders!}
+                      @pick-auth-provider=${this._handleAuthProviderPick}
+                    ></ha-pick-auth-provider>
+                  `
+                : ""}`}
       </div>
       <div class="footer">
         <ha-language-picker

src/cast/receiver_messages.ts

@@ -33,7 +33,10 @@ export interface ShowDemoMessage extends BaseCastMessage {
 }
 
 export type HassMessage =
-  ShowDemoMessage | GetStatusMessage | ConnectMessage | ShowLovelaceViewMessage;
+  | ShowDemoMessage
+  | GetStatusMessage
+  | ConnectMessage
+  | ShowLovelaceViewMessage;
 
 export const castSendAuth = (cast: CastManager, auth: Auth) =>
   cast.sendMessage({

src/common/condition/extract.ts

@@ -1,17 +1,24 @@
 import type {
-  Condition,
   TimeCondition,
+  VisibilityCondition,
 } from "../../panels/lovelace/common/validate-condition";
 
 /**
  * Extract media queries from conditions recursively
  */
-export function extractMediaQueries(conditions: Condition[]): string[] {
+export function extractMediaQueries(
+  conditions: VisibilityCondition[]
+): string[] {
   return conditions.reduce<string[]>((array, c) => {
     if ("conditions" in c && c.conditions) {
       array.push(...extractMediaQueries(c.conditions));
     }
-    if (c.condition === "screen" && c.media_query) {
+    if (
+      "condition" in c &&
+      c.condition === "screen" &&
+      "media_query" in c &&
+      c.media_query
+    ) {
       array.push(c.media_query);
     }
     return array;
@@ -22,14 +29,16 @@ export function extractMediaQueries(conditions: Condition[]): string[] {
  * Extract time conditions from conditions recursively
  */
 export function extractTimeConditions(
-  conditions: Condition[]
+  conditions: VisibilityCondition[]
 ): TimeCondition[] {
   return conditions.reduce<TimeCondition[]>((array, c) => {
     if ("conditions" in c && c.conditions) {
       array.push(...extractTimeConditions(c.conditions));
     }
-    if (c.condition === "time") {
-      array.push(c);
+    if ("condition" in c && c.condition === "time") {
+      // Dashboard `time` is always the client-side lovelace shape; core `time`
+      // is intentionally excluded from VisibilityCondition.
+      array.push(c as TimeCondition);
     }
     return array;
   }, []);

src/common/condition/listeners.ts

@@ -1,10 +1,9 @@
 import { listenMediaQuery } from "../dom/media_query";
 import type { HomeAssistant } from "../../types";
 import type {
-  Condition,
-  ConditionContext,
+  TimeCondition,
+  VisibilityCondition,
 } from "../../panels/lovelace/common/validate-condition";
-import { checkConditionsMet } from "../../panels/lovelace/common/validate-condition";
 import { extractMediaQueries, extractTimeConditions } from "./extract";
 import { calculateNextTimeUpdate } from "./time-calculator";
 
@@ -16,95 +15,68 @@ import { calculateNextTimeUpdate } from "./time-calculator";
 const MAX_TIMEOUT_DELAY = 2147483647;
 
 /**
- * Helper to setup media query listeners for conditional visibility
+ * Schedule a callback to fire at the next boundary of a time condition,
+ * rescheduling itself afterwards. Delays beyond the setTimeout maximum are
+ * capped and re-scheduled without firing (so the boundary is only reported
+ * once it is actually reached). Registers a single cleanup function that
+ * clears the pending timeout.
  */
-export function setupMediaQueryListeners(
-  conditions: Condition[],
-  hass: HomeAssistant,
+function scheduleTimeBoundaryListener(
+  getHass: () => HomeAssistant,
+  timeCondition: Omit<TimeCondition, "condition">,
   addListener: (unsub: () => void) => void,
-  onUpdate: (conditionsMet: boolean) => void,
-  getContext?: () => ConditionContext
+  onBoundary: () => void
 ): void {
-  const mediaQueries = extractMediaQueries(conditions);
+  let timeoutId: ReturnType<typeof setTimeout> | undefined;
 
-  if (mediaQueries.length === 0) return;
+  const scheduleUpdate = () => {
+    // Read hass lazily so timezone changes are picked up on the next boundary.
+    const delay = calculateNextTimeUpdate(getHass(), timeCondition);
 
-  // Optimization for single media query
-  const hasOnlyMediaQuery =
-    conditions.length === 1 &&
-    conditions[0].condition === "screen" &&
-    !!conditions[0].media_query;
+    if (delay === undefined) return;
 
-  mediaQueries.forEach((mediaQuery) => {
-    const unsub = listenMediaQuery(mediaQuery, (matches) => {
-      if (hasOnlyMediaQuery) {
-        onUpdate(matches);
-      } else {
-        const context = getContext?.() ?? {};
-        const conditionsMet = checkConditionsMet(conditions, hass, context);
-        onUpdate(conditionsMet);
+    // Cap delay to prevent setTimeout overflow
+    const cappedDelay = Math.min(delay, MAX_TIMEOUT_DELAY);
+
+    timeoutId = setTimeout(() => {
+      if (delay <= MAX_TIMEOUT_DELAY) {
+        onBoundary();
       }
-    });
-    addListener(unsub);
+      scheduleUpdate();
+    }, cappedDelay);
+  };
+
+  // Register cleanup function once, outside of scheduleUpdate
+  addListener(() => {
+    if (timeoutId !== undefined) {
+      clearTimeout(timeoutId);
+    }
   });
+
+  scheduleUpdate();
 }
 
 /**
- * Helper to setup time-based listeners for conditional visibility
+ * Observe the client-evaluated parts of a condition tree — `screen` media
+ * queries and `time` boundaries — and invoke `onChange` whenever one of them
+ * could have flipped.
+ *
+ * This does not evaluate the conditions itself: the caller recombines client
+ * and server results on notification. Used by `ConditionEvaluatorController`,
+ * which merges these client signals with the results of `subscribe_condition`
+ * subscriptions.
  */
-export function setupTimeListeners(
-  conditions: Condition[],
-  hass: HomeAssistant,
+export function observeConditionChanges(
+  conditions: VisibilityCondition[],
+  getHass: () => HomeAssistant,
   addListener: (unsub: () => void) => void,
-  onUpdate: (conditionsMet: boolean) => void,
-  getContext?: () => ConditionContext
+  onChange: () => void
 ): void {
-  const timeConditions = extractTimeConditions(conditions);
+  extractMediaQueries(conditions).forEach((mediaQuery) => {
+    addListener(listenMediaQuery(mediaQuery, () => onChange()));
+  });
 
-  if (timeConditions.length === 0) return;
-
-  timeConditions.forEach((timeCondition) => {
-    let timeoutId: ReturnType<typeof setTimeout> | undefined;
-
-    const scheduleUpdate = () => {
-      const delay = calculateNextTimeUpdate(hass, timeCondition);
-
-      if (delay === undefined) return;
-
-      // Cap delay to prevent setTimeout overflow
-      const cappedDelay = Math.min(delay, MAX_TIMEOUT_DELAY);
-
-      timeoutId = setTimeout(() => {
-        if (delay <= MAX_TIMEOUT_DELAY) {
-          const context = getContext?.() ?? {};
-          const conditionsMet = checkConditionsMet(conditions, hass, context);
-          onUpdate(conditionsMet);
-        }
-        scheduleUpdate();
-      }, cappedDelay);
-    };
-
-    // Register cleanup function once, outside of scheduleUpdate
-    addListener(() => {
-      if (timeoutId !== undefined) {
-        clearTimeout(timeoutId);
-      }
-    });
-
-    scheduleUpdate();
+  extractTimeConditions(conditions).forEach((timeCondition) => {
+    scheduleTimeBoundaryListener(getHass, timeCondition, addListener, onChange);
   });
 }
-
-/**
- * Sets up all condition listeners (media query, time) for conditional visibility.
- */
-export function setupConditionListeners(
-  conditions: Condition[],
-  hass: HomeAssistant,
-  addListener: (unsub: () => void) => void,
-  onUpdate: (conditionsMet: boolean) => void,
-  getContext?: () => ConditionContext
-): void {
-  setupMediaQueryListeners(conditions, hass, addListener, onUpdate, getContext);
-  setupTimeListeners(conditions, hass, addListener, onUpdate, getContext);
-}

src/common/condition/split.ts

@@ -0,0 +1,176 @@
+import type { Condition as CoreCondition } from "../../data/automation";
+import type { VisibilityCondition } from "../../panels/lovelace/common/validate-condition";
+import {
+  isLogicalCondition,
+  isServerCondition,
+  translateToCoreCondition,
+} from "./translate";
+
+/** A maximal server subtree, to be opened as one `subscribe_condition`. */
+export interface ServerSubtree {
+  id: string;
+  coreCondition: CoreCondition;
+}
+
+/**
+ * Evaluate a single client-only condition leaf (`screen`, `user`,
+ * `view_columns`, `location`, `time`). Returns `undefined` when the outcome is
+ * not yet determinable (e.g. context not available).
+ */
+export type ClientConditionEvaluator = (
+  condition: VisibilityCondition
+) => boolean | undefined;
+
+/** Server subtree results keyed by {@link ServerSubtree.id}; `undefined` = not yet reported. */
+export type ServerConditionResults = Record<string, boolean | undefined>;
+
+export interface SplitConditionTree {
+  /** Maximal server subtrees, each to be opened as one `subscribe_condition`. */
+  serverSubtrees: ServerSubtree[];
+  /**
+   * Combine client + server results into the overall visibility using
+   * three-valued (Kleene) logic. Returns `undefined` while the outcome still
+   * depends on a server subtree that has not reported yet.
+   */
+  evaluate: (
+    clientEvaluator: ClientConditionEvaluator,
+    serverResults: ServerConditionResults
+  ) => boolean | undefined;
+}
+
+type EvalNode = (
+  clientEvaluator: ClientConditionEvaluator,
+  serverResults: ServerConditionResults
+) => boolean | undefined;
+
+// Three-valued logic combinators (true / false / undefined = unknown). `false`
+// dominates AND and `true` dominates OR regardless of any unknown sibling.
+const andNode =
+  (children: EvalNode[]): EvalNode =>
+  (clientEvaluator, serverResults) => {
+    let unknown = false;
+    for (const child of children) {
+      const value = child(clientEvaluator, serverResults);
+      if (value === false) return false;
+      if (value === undefined) unknown = true;
+    }
+    return unknown ? undefined : true;
+  };
+
+const orNode =
+  (children: EvalNode[]): EvalNode =>
+  (clientEvaluator, serverResults) => {
+    let unknown = false;
+    for (const child of children) {
+      const value = child(clientEvaluator, serverResults);
+      if (value === true) return true;
+      if (value === undefined) unknown = true;
+    }
+    return unknown ? undefined : false;
+  };
+
+const notNode =
+  (child: EvalNode): EvalNode =>
+  (clientEvaluator, serverResults) => {
+    const value = child(clientEvaluator, serverResults);
+    return value === undefined ? undefined : !value;
+  };
+
+const serverLeaf =
+  (id: string): EvalNode =>
+  (_clientEvaluator, serverResults) =>
+    serverResults[id];
+
+const clientLeaf =
+  (condition: VisibilityCondition): EvalNode =>
+  (clientEvaluator) =>
+    clientEvaluator(condition);
+
+/**
+ * Split a dashboard visibility condition tree into:
+ *
+ * - a flat list of **maximal server subtrees** (`serverSubtrees`), each
+ *   translated to core format and meant to back one `subscribe_condition`; and
+ * - an **`evaluate`** function that recombines those subtree results with
+ *   locally-evaluated client leaves into the overall visibility.
+ *
+ * The top-level array is treated as an implicit `AND`. Sibling server
+ * conditions sharing a logical parent (including that implicit top-level AND)
+ * are grouped into a *single* subscription using the parent's operator, to
+ * avoid subscription fan-out. A `not` combines its children with `AND` before
+ * negating, matching lovelace `not` semantics (¬(AND of children)).
+ */
+export const splitConditionTree = (
+  conditions: VisibilityCondition[]
+): SplitConditionTree => {
+  const serverSubtrees: ServerSubtree[] = [];
+  let nextId = 0;
+
+  const addSubtree = (coreCondition: CoreCondition): EvalNode => {
+    const id = String(nextId);
+    nextId += 1;
+    serverSubtrees.push({ id, coreCondition });
+    return serverLeaf(id);
+  };
+
+  // Partition children into client/server, group the server siblings into one
+  // subscription, and recurse into the client ones. `groupOperator` is the
+  // operator used to combine the grouped server siblings.
+  const buildSiblings = (
+    children: VisibilityCondition[],
+    groupOperator: "and" | "or"
+  ): EvalNode[] => {
+    const serverChildren: VisibilityCondition[] = [];
+    const clientChildren: VisibilityCondition[] = [];
+    for (const child of children) {
+      (isServerCondition(child) ? serverChildren : clientChildren).push(child);
+    }
+
+    const nodes: EvalNode[] = [];
+
+    if (serverChildren.length === 1) {
+      nodes.push(addSubtree(translateToCoreCondition(serverChildren[0])));
+    } else if (serverChildren.length > 1) {
+      nodes.push(
+        addSubtree({
+          condition: groupOperator,
+          conditions: serverChildren.map(translateToCoreCondition),
+        })
+      );
+    }
+
+    for (const child of clientChildren) {
+      nodes.push(build(child));
+    }
+
+    return nodes;
+  };
+
+  // Only ever reached for client-class nodes (server subtrees are grouped and
+  // translated whole by `buildSiblings`).
+  const build = (condition: VisibilityCondition): EvalNode => {
+    if (isLogicalCondition(condition)) {
+      const children = condition.conditions ?? [];
+      if (condition.condition === "or") {
+        return orNode(buildSiblings(children, "or"));
+      }
+      if (condition.condition === "not") {
+        return notNode(andNode(buildSiblings(children, "and")));
+      }
+      return andNode(buildSiblings(children, "and"));
+    }
+    // Defensive: a server leaf reaching here still becomes a subscription.
+    if (isServerCondition(condition)) {
+      return addSubtree(translateToCoreCondition(condition));
+    }
+    return clientLeaf(condition);
+  };
+
+  const root = andNode(buildSiblings(conditions, "and"));
+
+  return {
+    serverSubtrees,
+    evaluate: (clientEvaluator, serverResults) =>
+      root(clientEvaluator, serverResults),
+  };
+};

src/common/condition/translate.ts

@@ -0,0 +1,251 @@
+import type {
+  Condition as CoreCondition,
+  NumericStateCondition as CoreNumericStateCondition,
+  StateCondition as CoreStateCondition,
+} from "../../data/automation";
+import type {
+  LegacyCondition,
+  NumericStateCondition as LovelaceNumericStateCondition,
+  StateCondition as LovelaceStateCondition,
+  VisibilityCondition,
+  VisibilityLogicalCondition,
+} from "../../panels/lovelace/common/validate-condition";
+import { isValidEntityId } from "../entity/valid_entity_id";
+
+/**
+ * Lovelace condition types evaluated on the client; these have no usable core
+ * equivalent for dashboards and are never sent to `subscribe_condition`.
+ */
+const CLIENT_CONDITION_TYPES = new Set([
+  "screen",
+  "user",
+  "view_columns",
+  "location",
+  "time",
+]);
+
+const LOGICAL_CONDITION_TYPES = new Set(["and", "or", "not"]);
+
+/** Type guard for the `and` / `or` / `not` combinators. */
+export const isLogicalCondition = (
+  condition: VisibilityCondition
+): condition is VisibilityLogicalCondition =>
+  "condition" in condition && LOGICAL_CONDITION_TYPES.has(condition.condition);
+
+/**
+ * Whether a condition must be evaluated server-side (via `subscribe_condition`).
+ *
+ * Leaves: everything except the client-only lovelace types is server-class,
+ * including legacy `{ entity, state }` conditions (treated as `state`) and any
+ * integration-provided condition.
+ *
+ * Compounds (`and` / `or` / `not`) are server-class only when *every*
+ * descendant is, so a single client leaf anywhere forces the whole compound
+ * client-side, where it becomes a combinator wrapping server subtrees (see
+ * `splitConditionTree`). An empty compound is vacuously server-class.
+ */
+export const isServerCondition = (condition: VisibilityCondition): boolean => {
+  if (isLogicalCondition(condition)) {
+    return (condition.conditions ?? []).every(isServerCondition);
+  }
+  // Legacy lovelace condition without a `condition` key → treated as `state`.
+  if (!("condition" in condition)) {
+    return true;
+  }
+  return !CLIENT_CONDITION_TYPES.has(condition.condition);
+};
+
+/** Inverse of {@link isServerCondition}. */
+export const isClientCondition = (condition: VisibilityCondition): boolean =>
+  !isServerCondition(condition);
+
+/**
+ * Whether *every* leaf in the tree is a client-only condition, so the whole
+ * tree can be evaluated and validated client-side without any
+ * `subscribe_condition` round-trip. Distinct from {@link isClientCondition},
+ * which is true when *any* leaf is client-side.
+ */
+export const isPureClientCondition = (
+  condition: VisibilityCondition
+): boolean =>
+  isLogicalCondition(condition)
+    ? (condition.conditions ?? []).every(isPureClientCondition)
+    : isClientCondition(condition);
+
+/**
+ * Translate a server-class lovelace condition into its core automation
+ * equivalent. Core-format conditions (and condition types with no lovelace
+ * counterpart, like `template` / `sun` / `zone` / `device` / integration
+ * conditions) are passed through untouched.
+ *
+ * The caller is responsible for only translating server-class conditions
+ * ({@link isServerCondition}); passing a client-only condition just returns it
+ * unchanged.
+ */
+export const translateToCoreCondition = (
+  condition: VisibilityCondition
+): CoreCondition => {
+  // Legacy lovelace condition: { entity, state, state_not } with no `condition`.
+  if (!("condition" in condition)) {
+    return translateStateCondition({ condition: "state", ...condition });
+  }
+
+  if (isLogicalCondition(condition)) {
+    return translateLogicalCondition(condition);
+  }
+
+  switch (condition.condition) {
+    case "state":
+      return translateStateCondition(condition as LovelaceStateCondition);
+    case "numeric_state":
+      return translateNumericStateCondition(
+        condition as LovelaceNumericStateCondition
+      );
+    default:
+      // Already core format (sun, zone, template, device, integration, or a
+      // core `state` / `numeric_state` carrying `entity_id`) → pass through.
+      return condition as CoreCondition;
+  }
+};
+
+// A core condition that always evaluates to false — ¬(AND of nothing) = ¬true.
+// Used where checkConditionsMet short-circuits to false (an incomplete config),
+// so we never emit a schema-invalid condition that would break a grouped
+// subscription.
+const alwaysFalseCondition = (): CoreCondition => ({
+  condition: "not",
+  conditions: [{ condition: "and", conditions: [] }],
+});
+
+const translateStateCondition = (
+  condition: LovelaceStateCondition | CoreStateCondition | LegacyCondition
+): CoreCondition => {
+  // Already core format — distinguished from lovelace by `entity_id`.
+  if ("entity_id" in condition) {
+    return condition as CoreStateCondition;
+  }
+
+  const lovelace = condition as LovelaceStateCondition;
+
+  // Incomplete config: no entity, or no comparison value. checkConditionsMet
+  // returns false for these (and a `state` condition with no `entity_id` /
+  // `state` is invalid for core), so resolve to a clean always-false.
+  if (
+    lovelace.entity === undefined ||
+    (lovelace.state === undefined && lovelace.state_not === undefined)
+  ) {
+    return alwaysFalseCondition();
+  }
+
+  const base = {
+    condition: "state" as const,
+    entity_id: lovelace.entity,
+    ...(lovelace.attribute !== undefined
+      ? { attribute: lovelace.attribute }
+      : {}),
+  };
+
+  // KNOWN LIMITATION: when the compared value is itself an entity id, lovelace
+  // (checkStateCondition -> getValueFromEntityId) resolves *any* entity to its
+  // live state, but core's `state` condition only dereferences `input_*`
+  // entities and compares everything else literally. A value referencing a
+  // non-`input_*` entity therefore changes meaning after delegation. This is
+  // niche (the visibility editor does not offer entity-as-value) and left as a
+  // future enhancement — a faithful, reactive fix would emit a `template`
+  // condition. See https://github.com/home-assistant/frontend/issues/52836.
+
+  // `state` wins over `state_not` when both are present, mirroring
+  // checkConditionsMet (`state ?? state_not`, positive branch when `state`).
+  if (lovelace.state !== undefined) {
+    return { ...base, state: lovelace.state } as CoreStateCondition;
+  }
+
+  // Core has no `state_not`; wrap a positive `state` in `not`.
+  return {
+    condition: "not",
+    conditions: [{ ...base, state: lovelace.state_not } as CoreStateCondition],
+  };
+};
+
+const translateNumericStateCondition = (
+  condition: LovelaceNumericStateCondition | CoreNumericStateCondition
+): CoreCondition => {
+  if ("entity_id" in condition) {
+    return condition as CoreNumericStateCondition;
+  }
+  const lovelace = condition as LovelaceNumericStateCondition;
+  const core: CoreNumericStateCondition = {
+    condition: "numeric_state",
+    entity_id: lovelace.entity as string,
+  };
+  if (lovelace.attribute !== undefined) {
+    core.attribute = lovelace.attribute;
+  }
+  const above = translateNumericBound(lovelace.above);
+  if (above !== undefined) {
+    core.above = above;
+  }
+  const below = translateNumericBound(lovelace.below);
+  if (below !== undefined) {
+    core.below = below;
+  }
+  return core;
+};
+
+/**
+ * Reconcile a lovelace numeric bound with core's interpretation. Lovelace
+ * resolves a string bound to an entity's state only when that entity exists,
+ * otherwise falling back to `Number(...)` (which yields `NaN` for junk, leaving
+ * the bound effectively ignored). Core instead treats *every* string bound as
+ * an entity id and errors when it is not one. To preserve lovelace behavior:
+ *
+ * - a finite numeric string (`"5"`, `"10.5"`, even `""` → 0) coerces to a
+ *   number (the entity-id regex matches `"10.5"`, so test `Number()` first);
+ * - a genuine entity-id reference passes through for core to resolve;
+ * - anything else (junk like `"foo"`, or non-finite like `"1e400"`) is dropped,
+ *   matching lovelace's "NaN ⇒ ignored" and never emitting a non-finite number
+ *   (which is not JSON-serializable).
+ */
+const translateNumericBound = (
+  bound: string | number | undefined
+): string | number | undefined => {
+  if (typeof bound !== "string") {
+    return bound;
+  }
+  const numeric = Number(bound);
+  if (!isNaN(numeric) && isFinite(numeric)) {
+    return numeric;
+  }
+  if (isValidEntityId(bound)) {
+    return bound;
+  }
+  return undefined;
+};
+
+const translateLogicalCondition = (
+  condition: VisibilityLogicalCondition
+): CoreCondition => {
+  // Lovelace treats a logical condition with no `conditions` key as vacuously
+  // true (checkAnd/Or/NotCondition all early-return on a missing list).
+  if (condition.conditions === undefined) {
+    return { condition: "and", conditions: [] };
+  }
+
+  const conditions = condition.conditions.map(translateToCoreCondition);
+
+  if (condition.condition === "not") {
+    // Lovelace `not` means ¬(AND of children); core `not` means ¬(OR of
+    // children). Wrapping the children in an `and` preserves the lovelace
+    // meaning for any arity — including an empty `not`, which becomes ¬(AND of
+    // nothing) = ¬true = false, matching checkConditionsMet. A single child is
+    // unambiguous (¬(OR of one) = ¬(AND of one)) and left unwrapped for a
+    // tidier persisted form.
+    if (conditions.length === 1) {
+      return { condition: "not", conditions };
+    }
+    return { condition: "not", conditions: [{ condition: "and", conditions }] };
+  }
+
+  // Empty `and` (true) / `or` (false) already agree between lovelace and core.
+  return { condition: condition.condition, conditions };
+};

src/common/const.ts

@@ -91,14 +91,7 @@ export const STATES_OFF = ["closed", "locked", "off"];
 export const BINARY_STATE_ON = "on";
 export const BINARY_STATE_OFF = "off";
 
-/** Domains where we allow toggle in Lovelace.
- *  This is not strictly a list of what is possible to toggle, but the list of
- *  domains where toggle is considered the primary default behavior.
- *  Entities card uses this to determine which entities are controlled by the
- *  header toggle.
- *  Some cards use this to decide the default tap action.
- *  Use canToggleDomain/canToggleState for determining if toggling is possible.
- */
+/** Domains where we allow toggle in Lovelace. */
 export const DOMAINS_TOGGLE = new Set([
   "fan",
   "input_boolean",

src/common/controllers/condition-evaluator-controller.ts

@@ -0,0 +1,329 @@
+import type {
+  ReactiveController,
+  ReactiveControllerHost,
+} from "@lit/reactive-element/reactive-controller";
+import type { Connection, UnsubscribeFunc } from "home-assistant-js-websocket";
+import { subscribeCondition } from "../../data/automation";
+import type {
+  Condition,
+  ConditionContext,
+  VisibilityCondition,
+} from "../../panels/lovelace/common/validate-condition";
+import { checkConditionsMet } from "../../panels/lovelace/common/validate-condition";
+import type { HomeAssistant } from "../../types";
+import { observeConditionChanges } from "../condition/listeners";
+import type {
+  ClientConditionEvaluator,
+  ServerConditionResults,
+  SplitConditionTree,
+} from "../condition/split";
+import { splitConditionTree } from "../condition/split";
+
+/** Tri-state visibility outcome. `unknown` = a server subtree has not reported yet. */
+export type ConditionEvaluation = "visible" | "hidden" | "unknown";
+
+export interface ConditionEvaluatorOptions {
+  /** Called whenever the combined result or error changes. */
+  onResult: (result: ConditionEvaluation, error?: string) => void;
+  /** Debounce (ms) before (re)opening subscriptions when the tree changes. */
+  resubscribeDelay?: number;
+}
+
+const DEFAULT_RESUBSCRIBE_DELAY = 50;
+
+/**
+ * Reactive controller that keeps a dashboard visibility condition tree
+ * evaluated live by combining:
+ *
+ * - `subscribe_condition` subscriptions, one per maximal server subtree
+ *   (`state`, `numeric_state`, `template`, `sun`, `zone`, `device`,
+ *   integration conditions), and
+ * - locally-evaluated client leaves (`screen`, `user`, `view_columns`,
+ *   `location`, `time`), reacting to media-query / time-boundary / hass /
+ *   context changes.
+ *
+ * The host calls {@link observe} whenever its inputs change; the controller
+ * only (re)subscribes when the *condition tree* changes (debounced) and merely
+ * recomputes for hass/context changes. Subscriptions are torn down on host
+ * disconnect and re-opened on reconnect. The combined result uses three-valued
+ * logic so the host can render an explicit `unknown` state without flashing
+ * while server results are still pending.
+ */
+export class ConditionEvaluatorController implements ReactiveController {
+  private _host: ReactiveControllerHost;
+
+  private readonly _onResult: ConditionEvaluatorOptions["onResult"];
+
+  private readonly _resubscribeDelay: number;
+
+  private _conditions?: VisibilityCondition[];
+
+  private _hass?: HomeAssistant;
+
+  private _getContext?: () => ConditionContext;
+
+  private _connected = false;
+
+  // Structural signature of the tree the live subscriptions/listeners are for,
+  // and of the tree a pending (debounced) re-subscribe will switch to. Compared
+  // by value (not array reference) so a host re-deriving the array each render
+  // does not starve the debounce or needlessly drop subscriptions.
+  private _subscribedSignature?: string;
+
+  private _pendingSignature?: string;
+
+  // Memoize the signature for a stable array reference to avoid re-stringifying
+  // on every host update.
+  private _lastConditionsRef?: VisibilityCondition[];
+
+  private _lastSignature?: string;
+
+  private _split?: SplitConditionTree;
+
+  private _serverResults: ServerConditionResults = {};
+
+  private _subtreeErrors: Record<string, string | undefined> = {};
+
+  private _subscriptions: Promise<UnsubscribeFunc>[] = [];
+
+  private _listeners: (() => void)[] = [];
+
+  // Bumped on every teardown so late-arriving async results are ignored.
+  private _generation = 0;
+
+  private _resubscribeTimeout?: ReturnType<typeof setTimeout>;
+
+  private _result: ConditionEvaluation = "unknown";
+
+  private _error?: string;
+
+  private _notifiedResult?: ConditionEvaluation;
+
+  private _notifiedError?: string;
+
+  constructor(
+    host: ReactiveControllerHost,
+    options: ConditionEvaluatorOptions
+  ) {
+    this._host = host;
+    this._onResult = options.onResult;
+    this._resubscribeDelay =
+      options.resubscribeDelay ?? DEFAULT_RESUBSCRIBE_DELAY;
+    host.addController(this);
+  }
+
+  public get result(): ConditionEvaluation {
+    return this._result;
+  }
+
+  public get error(): string | undefined {
+    return this._error;
+  }
+
+  /**
+   * Provide the latest inputs. Cheap to call on every host update: it only
+   * (re)subscribes when the condition tree reference changes, otherwise it just
+   * recomputes the client-dependent parts.
+   */
+  public observe(
+    conditions: VisibilityCondition[] | undefined,
+    hass: HomeAssistant | undefined,
+    getContext?: () => ConditionContext
+  ): void {
+    this._conditions = conditions;
+    this._hass = hass;
+    this._getContext = getContext;
+    this._sync();
+  }
+
+  public hostConnected(): void {
+    this._connected = true;
+    this._sync();
+  }
+
+  public hostDisconnected(): void {
+    this._connected = false;
+    this._teardown();
+    // Nothing backs the last result once subscriptions are closed; report
+    // `unknown` (and force the notification through) so a detached/reconnecting
+    // host never renders a stale, no-longer-live visibility.
+    this._notifiedResult = undefined;
+    this._notifiedError = undefined;
+    this._setResult("unknown", undefined);
+  }
+
+  private _signatureOf(
+    conditions: VisibilityCondition[] | undefined
+  ): string | undefined {
+    if (conditions === undefined) {
+      return undefined;
+    }
+    if (conditions === this._lastConditionsRef) {
+      return this._lastSignature;
+    }
+    this._lastConditionsRef = conditions;
+    this._lastSignature = JSON.stringify(conditions);
+    return this._lastSignature;
+  }
+
+  private _sync(): void {
+    if (!this._connected) {
+      return;
+    }
+    const signature = this._signatureOf(this._conditions);
+    // Re-subscribe only when the tree we are (or are about to be) subscribed to
+    // actually differs by value — not merely by array reference.
+    const targetSignature = this._pendingSignature ?? this._subscribedSignature;
+    if (signature !== targetSignature) {
+      this._pendingSignature = signature;
+      this._scheduleResubscribe();
+    }
+    // Always recompute so client leaves (and the current split) stay live, even
+    // while a re-subscribe is pending.
+    this._recompute();
+  }
+
+  private _scheduleResubscribe(): void {
+    if (this._resubscribeTimeout !== undefined) {
+      clearTimeout(this._resubscribeTimeout);
+    }
+    this._resubscribeTimeout = setTimeout(() => {
+      this._resubscribeTimeout = undefined;
+      this._subscribe();
+    }, this._resubscribeDelay);
+  }
+
+  private _subscribe(): void {
+    this._teardown();
+
+    const conditions = this._conditions;
+    const hass = this._hass;
+    this._subscribedSignature = this._signatureOf(conditions);
+    this._pendingSignature = undefined;
+
+    if (!conditions || !hass) {
+      this._setResult("unknown", undefined);
+      return;
+    }
+
+    const split = splitConditionTree(conditions);
+    this._split = split;
+
+    const generation = this._generation;
+    const connection: Connection = hass.connection;
+
+    for (const subtree of split.serverSubtrees) {
+      this._serverResults[subtree.id] = undefined;
+      const subscription = subscribeCondition(
+        connection,
+        (message) => {
+          if (generation !== this._generation) {
+            return;
+          }
+          if (message.error !== undefined) {
+            this._serverResults[subtree.id] = false;
+            this._subtreeErrors[subtree.id] =
+              typeof message.error === "string"
+                ? message.error
+                : message.error.message;
+          } else {
+            this._serverResults[subtree.id] = message.result;
+            this._subtreeErrors[subtree.id] = undefined;
+          }
+          this._recompute();
+        },
+        subtree.coreCondition
+      );
+      subscription.catch((err: unknown) => {
+        if (generation !== this._generation) {
+          return;
+        }
+        this._serverResults[subtree.id] = false;
+        this._subtreeErrors[subtree.id] =
+          err instanceof Error ? err.message : String(err);
+        this._recompute();
+      });
+      this._subscriptions.push(subscription);
+    }
+
+    observeConditionChanges(
+      conditions,
+      () => this._hass ?? hass,
+      (unsub) => this._listeners.push(unsub),
+      () => this._recompute()
+    );
+
+    this._recompute();
+  }
+
+  private _recompute(): void {
+    if (!this._split || !this._hass) {
+      this._setResult("unknown", undefined);
+      return;
+    }
+
+    const hass = this._hass;
+    const context = this._getContext?.() ?? {};
+    const clientEvaluator: ClientConditionEvaluator = (condition) => {
+      try {
+        // Only client-class leaves reach here, and those are all lovelace
+        // Condition members.
+        return checkConditionsMet([condition as Condition], hass, context);
+      } catch (_err) {
+        return false;
+      }
+    };
+
+    const value = this._split.evaluate(clientEvaluator, this._serverResults);
+    const result: ConditionEvaluation =
+      value === undefined ? "unknown" : value ? "visible" : "hidden";
+
+    this._setResult(result, this._combinedError());
+  }
+
+  private _combinedError(): string | undefined {
+    for (const error of Object.values(this._subtreeErrors)) {
+      if (error) {
+        return error;
+      }
+    }
+    return undefined;
+  }
+
+  private _setResult(
+    result: ConditionEvaluation,
+    error: string | undefined
+  ): void {
+    this._result = result;
+    this._error = error;
+    if (result === this._notifiedResult && error === this._notifiedError) {
+      return;
+    }
+    this._notifiedResult = result;
+    this._notifiedError = error;
+    this._onResult(result, error);
+    this._host.requestUpdate();
+  }
+
+  private _teardown(): void {
+    // Invalidate any in-flight subscription callbacks.
+    this._generation += 1;
+    if (this._resubscribeTimeout !== undefined) {
+      clearTimeout(this._resubscribeTimeout);
+      this._resubscribeTimeout = undefined;
+    }
+    for (const subscription of this._subscriptions) {
+      subscription.then((unsub) => unsub()).catch(() => undefined);
+    }
+    this._subscriptions = [];
+    for (const unsub of this._listeners) {
+      unsub();
+    }
+    this._listeners = [];
+    this._split = undefined;
+    this._serverResults = {};
+    this._subtreeErrors = {};
+    this._subscribedSignature = undefined;
+    this._pendingSignature = undefined;
+  }
+}

src/common/controllers/condition-listeners-controller.ts

@@ -1,59 +0,0 @@
-import type {
-  ReactiveController,
-  ReactiveControllerHost,
-} from "@lit/reactive-element/reactive-controller";
-import type {
-  Condition,
-  ConditionContext,
-} from "../../panels/lovelace/common/validate-condition";
-import type { HomeAssistant } from "../../types";
-import { setupConditionListeners } from "../condition/listeners";
-
-/**
- * Reactive controller that manages the media-query and time-based listeners
- * needed to keep a set of lovelace visibility conditions evaluated live.
- *
- * The host is responsible for the actual evaluation (e.g. computing visible /
- * hidden / invalid state); the controller only triggers it via the supplied
- * `onUpdate` callback when something the conditions depend on changes. Call
- * `setup()` whenever the conditions change; the controller clears previous
- * listeners and re-subscribes. Listeners are automatically released when the
- * host disconnects.
- */
-export class ConditionListenersController implements ReactiveController {
-  private _unsubs: (() => void)[] = [];
-
-  constructor(host: ReactiveControllerHost) {
-    host.addController(this);
-  }
-
-  public hostDisconnected(): void {
-    this.clear();
-  }
-
-  public setup(
-    conditions: Condition[],
-    hass: HomeAssistant,
-    onUpdate: () => void,
-    getContext?: () => ConditionContext
-  ): void {
-    this.clear();
-    if (!conditions.length) {
-      return;
-    }
-    setupConditionListeners(
-      conditions,
-      hass,
-      (unsub) => this._unsubs.push(unsub),
-      () => onUpdate(),
-      getContext
-    );
-  }
-
-  public clear(): void {
-    for (const unsub of this._unsubs) {
-      unsub();
-    }
-    this._unsubs = [];
-  }
-}

src/common/datetime/weekday.ts

@@ -1,7 +1,13 @@
 export type WeekdayIndex = 0 | 1 | 2 | 3 | 4 | 5 | 6;
 
 export type WeekdayShort =
-  "sun" | "mon" | "tue" | "wed" | "thu" | "fri" | "sat";
+  | "sun"
+  | "mon"
+  | "tue"
+  | "wed"
+  | "thu"
+  | "fri"
+  | "sat";
 
 export type WeekdayLong =
   | "sunday"