Add column option to grid section config

Add column density option to the grid section

Fix translations

Rename to grid density

Limit card size with the grid size

Rename function

Fix types

.eslintrc.json

@@ -124,9 +124,7 @@
     "lit-a11y/no-autofocus": "off",
     "lit-a11y/alt-text": "warn",
     "lit-a11y/anchor-is-valid": "warn",
-    "lit-a11y/role-has-required-aria-attrs": "warn",
-    "@typescript-eslint/consistent-type-imports": "error",
-    "@typescript-eslint/no-import-type-side-effects": "error"
+    "lit-a11y/role-has-required-aria-attrs": "warn"
   },
   "plugins": ["unused-imports"]
 }

.github/workflows/cast_deployment.yaml

@@ -21,12 +21,12 @@ jobs:
       url: ${{ steps.deploy.outputs.NETLIFY_LIVE_URL || steps.deploy.outputs.NETLIFY_URL }}
     steps:
       - name: Check out files from GitHub
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
         with:
           ref: dev
 
       - name: Setup Node
-        uses: actions/setup-node@v4.1.0
+        uses: actions/setup-node@v4.0.4
         with:
           node-version-file: ".nvmrc"
           cache: yarn
@@ -57,12 +57,12 @@ jobs:
       url: ${{ steps.deploy.outputs.NETLIFY_LIVE_URL || steps.deploy.outputs.NETLIFY_URL }}
     steps:
       - name: Check out files from GitHub
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
         with:
           ref: master
 
       - name: Setup Node
-        uses: actions/setup-node@v4.1.0
+        uses: actions/setup-node@v4.0.4
         with:
           node-version-file: ".nvmrc"
           cache: yarn

.github/workflows/ci.yaml

@@ -24,9 +24,9 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Check out files from GitHub
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
       - name: Setup Node
-        uses: actions/setup-node@v4.1.0
+        uses: actions/setup-node@v4.0.4
         with:
           node-version-file: ".nvmrc"
           cache: yarn
@@ -37,7 +37,7 @@ jobs:
       - name: Build resources
         run: ./node_modules/.bin/gulp gen-icons-json build-translations build-locale-data gather-gallery-pages
       - name: Setup lint cache
-        uses: actions/cache@v4.1.2
+        uses: actions/cache@v4.1.1
         with:
           path: |
             node_modules/.cache/prettier
@@ -58,9 +58,9 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Check out files from GitHub
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
       - name: Setup Node
-        uses: actions/setup-node@v4.1.0
+        uses: actions/setup-node@v4.0.4
         with:
           node-version-file: ".nvmrc"
           cache: yarn
@@ -76,9 +76,9 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Check out files from GitHub
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
       - name: Setup Node
-        uses: actions/setup-node@v4.1.0
+        uses: actions/setup-node@v4.0.4
         with:
           node-version-file: ".nvmrc"
           cache: yarn
@@ -100,9 +100,9 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Check out files from GitHub
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
       - name: Setup Node
-        uses: actions/setup-node@v4.1.0
+        uses: actions/setup-node@v4.0.4
         with:
           node-version-file: ".nvmrc"
           cache: yarn

.github/workflows/codeql-analysis.yml

@@ -23,7 +23,7 @@ jobs:
 
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
         with:
           # We must fetch at least the immediate parents so that if this is
           # a pull request then we can checkout the head.

.github/workflows/demo_deployment.yaml

@@ -22,12 +22,12 @@ jobs:
       url: ${{ steps.deploy.outputs.NETLIFY_LIVE_URL || steps.deploy.outputs.NETLIFY_URL }}
     steps:
       - name: Check out files from GitHub
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
         with:
           ref: dev
 
       - name: Setup Node
-        uses: actions/setup-node@v4.1.0
+        uses: actions/setup-node@v4.0.4
         with:
           node-version-file: ".nvmrc"
           cache: yarn
@@ -58,12 +58,12 @@ jobs:
       url: ${{ steps.deploy.outputs.NETLIFY_LIVE_URL || steps.deploy.outputs.NETLIFY_URL }}
     steps:
       - name: Check out files from GitHub
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
         with:
           ref: master
 
       - name: Setup Node
-        uses: actions/setup-node@v4.1.0
+        uses: actions/setup-node@v4.0.4
         with:
           node-version-file: ".nvmrc"
           cache: yarn

.github/workflows/design_deployment.yaml

@@ -16,10 +16,10 @@ jobs:
       url: ${{ steps.deploy.outputs.NETLIFY_LIVE_URL || steps.deploy.outputs.NETLIFY_URL }}
     steps:
       - name: Check out files from GitHub
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
 
       - name: Setup Node
-        uses: actions/setup-node@v4.1.0
+        uses: actions/setup-node@v4.0.4
         with:
           node-version-file: ".nvmrc"
           cache: yarn

.github/workflows/design_preview.yaml

@@ -21,10 +21,10 @@ jobs:
     if: github.repository == 'home-assistant/frontend' && contains(github.event.pull_request.labels.*.name, 'needs design preview')
     steps:
       - name: Check out files from GitHub
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
 
       - name: Setup Node
-        uses: actions/setup-node@v4.1.0
+        uses: actions/setup-node@v4.0.4
         with:
           node-version-file: ".nvmrc"
           cache: yarn

.github/workflows/nightly.yaml

@@ -20,7 +20,7 @@ jobs:
       contents: write
     steps:
       - name: Checkout the repository
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
 
       - name: Set up Python ${{ env.PYTHON_VERSION }}
         uses: actions/setup-python@v5
@@ -28,7 +28,7 @@ jobs:
           python-version: ${{ env.PYTHON_VERSION }}
 
       - name: Setup Node
-        uses: actions/setup-node@v4.1.0
+        uses: actions/setup-node@v4.0.4
         with:
           node-version-file: ".nvmrc"
           cache: yarn

.github/workflows/relative-ci.yaml

@@ -17,7 +17,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Send bundle stats and build information to RelativeCI
-        uses: relative-ci/agent-action@v2.1.13
+        uses: relative-ci/agent-action@v2.1.12
         with:
           key: ${{ secrets[format('RELATIVE_CI_KEY_{0}_{1}', matrix.bundle, matrix.build)] }}
           token: ${{ github.token }}

.github/workflows/release.yaml

@@ -23,7 +23,7 @@ jobs:
       contents: write # Required to upload release assets
     steps:
       - name: Checkout the repository
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
 
       - name: Verify version
         uses: home-assistant/actions/helpers/verify-version@master
@@ -34,7 +34,7 @@ jobs:
           python-version: ${{ env.PYTHON_VERSION }}
 
       - name: Setup Node
-        uses: actions/setup-node@v4.1.0
+        uses: actions/setup-node@v4.0.4
         with:
           node-version-file: ".nvmrc"
           cache: yarn
@@ -55,7 +55,7 @@ jobs:
           script/release
 
       - name: Upload release assets
-        uses: softprops/action-gh-release@v2.0.9
+        uses: softprops/action-gh-release@v2.0.8
         with:
           files: |
             dist/*.whl

.github/workflows/translations.yaml

@@ -13,7 +13,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout the repository
-        uses: actions/checkout@v4.2.2
+        uses: actions/checkout@v4.2.1
 
       - name: Upload Translations
         run: |

.yarnrc.yml

@@ -6,4 +6,4 @@ enableGlobalCache: false
 
 nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-4.5.1.cjs
+yarnPath: .yarn/releases/yarn-4.5.0.cjs

build-scripts/gulp/download-translations.js

@@ -13,7 +13,7 @@ const srcMeta = "src/translations/translationMetadata.json";
 const encoding = "utf8";
 
 function hasHtml(data) {
-  return /<\S*>/i.test(data);
+  return /<[a-z][\s\S]*>/i.test(data);
 }
 
 function recursiveCheckHasHtml(file, data, errors, recKey) {

build-scripts/gulp/gather-static.js

@@ -106,14 +106,6 @@ function copyMapPanel(staticDir) {
   );
 }
 
-function copyZXingWasm(staticDir) {
-  const staticPath = genStaticPath(staticDir);
-  copyFileDir(
-    npmPath("zxing-wasm/dist/reader/zxing_reader.wasm"),
-    staticPath("js")
-  );
-}
-
 gulp.task("copy-locale-data", async () => {
   const staticDir = paths.app_output_static;
   copyLocaleData(staticDir);
@@ -151,7 +143,6 @@ gulp.task("copy-static-app", async () => {
   copyMapPanel(staticDir);
 
   // Qr Scanner assets
-  copyZXingWasm(staticDir);
   copyQrScannerWorker(staticDir);
 });
 

build-scripts/gulp/locale-data.js

@@ -24,11 +24,8 @@ const convertToJSON = async (
 ) => {
   let localeData;
   try {
-    // use "pt" for "pt-BR", because "pt-BR" is unsupported by @formatjs
-    const language = lang === "pt-BR" ? "pt" : lang;
-
     localeData = await readFile(
-      join(formatjsDir, pkg, subDir, `${language}.js`),
+      join(formatjsDir, pkg, subDir, `${lang}.js`),
       "utf-8"
     );
   } catch (e) {

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

@@ -1,12 +1,10 @@
 import "@material/mwc-button/mwc-button";
-import "@material/mwc-list/mwc-list";
-import type { ActionDetail } from "@material/mwc-list/mwc-list";
+import { ActionDetail } from "@material/mwc-list/mwc-list";
 import { mdiCast, mdiCastConnected, mdiViewDashboard } from "@mdi/js";
-import type { Auth, Connection } from "home-assistant-js-websocket";
-import type { CSSResultGroup, TemplateResult } from "lit";
-import { LitElement, css, html } from "lit";
+import { Auth, Connection } from "home-assistant-js-websocket";
+import { CSSResultGroup, LitElement, TemplateResult, css, html } from "lit";
 import { customElement, property, state } from "lit/decorators";
-import type { CastManager } from "../../../../src/cast/cast_manager";
+import { CastManager } from "../../../../src/cast/cast_manager";
 import {
   castSendShowLovelaceView,
   ensureConnectedCastSession,
@@ -25,7 +23,7 @@ import {
   getLovelaceCollection,
 } from "../../../../src/data/lovelace";
 import { isStrategyDashboard } from "../../../../src/data/lovelace/config/types";
-import type { LovelaceViewConfig } from "../../../../src/data/lovelace/config/view";
+import { LovelaceViewConfig } from "../../../../src/data/lovelace/config/view";
 import "../../../../src/layouts/hass-loading-screen";
 import { generateDefaultViewConfig } from "../../../../src/panels/lovelace/common/generate-lovelace-config";
 import "./hc-layout";
@@ -91,8 +89,8 @@ class HcCast extends LitElement {
                       generateDefaultViewConfig({}, {}, {}, {}, () => ""),
                     ]
                   ).map(
-                    (view, idx) => html`
-                      <ha-list-item
+                    (view, idx) =>
+                      html`<ha-list-item
                         graphic="avatar"
                         .activated=${this.castManager.status?.lovelacePath ===
                         (view.path ?? idx)}
@@ -110,9 +108,8 @@ class HcCast extends LitElement {
                           : html`<ha-svg-icon
                               slot="item-icon"
                               .path=${mdiViewDashboard}
-                            ></ha-svg-icon>`}
-                      </ha-list-item>
-                    `
+                            ></ha-svg-icon>`}</ha-list-item
+                      > `
                   )}</mwc-list
                 >
               `}

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

@@ -1,23 +1,19 @@
 import "@material/mwc-button";
 import { mdiCastConnected, mdiCast } from "@mdi/js";
-import type {
+import {
   Auth,
   Connection,
-  getAuthOptions,
-} from "home-assistant-js-websocket";
-import {
   createConnection,
   ERR_CANNOT_CONNECT,
   ERR_HASS_HOST_REQUIRED,
   ERR_INVALID_AUTH,
   ERR_INVALID_HTTPS_TO_HTTP,
   getAuth,
+  getAuthOptions,
 } from "home-assistant-js-websocket";
-import type { CSSResultGroup, TemplateResult } from "lit";
-import { css, html, LitElement } from "lit";
+import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
 import { customElement, state } from "lit/decorators";
-import type { CastManager } from "../../../../src/cast/cast_manager";
-import { getCastManager } from "../../../../src/cast/cast_manager";
+import { CastManager, getCastManager } from "../../../../src/cast/cast_manager";
 import { castSendShowDemo } from "../../../../src/cast/receiver_messages";
 import {
   loadTokens,

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

@@ -1,7 +1,10 @@
-import type { Auth, Connection, HassUser } from "home-assistant-js-websocket";
-import { getUser } from "home-assistant-js-websocket";
-import type { CSSResultGroup, TemplateResult } from "lit";
-import { css, html, LitElement } from "lit";
+import {
+  Auth,
+  Connection,
+  getUser,
+  HassUser,
+} from "home-assistant-js-websocket";
+import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
 import { customElement, property } from "lit/decorators";
 import "../../../../src/components/ha-card";
 
@@ -85,7 +88,7 @@ class HcLayout extends LitElement {
       }
 
       .card-header {
-        color: var(--ha-card-header-color, var(--primary-text-color));
+        color: var(--ha-card-header-color, --primary-text-color);
         font-family: var(--ha-card-header-font-family, inherit);
         font-size: var(--ha-card-header-font-size, 24px);
         letter-spacing: -0.012em;

cast/src/receiver/demo/cast-demo-entities.ts

@@ -1,5 +1,4 @@
-import type { Entity } from "../../../../src/fake_data/entity";
-import { convertEntities } from "../../../../src/fake_data/entity";
+import { convertEntities, Entity } from "../../../../src/fake_data/entity";
 
 export const castDemoEntities: () => Entity[] = () =>
   convertEntities({

cast/src/receiver/demo/cast-demo-lovelace.ts

@@ -1,5 +1,5 @@
-import type { LovelaceCardConfig } from "../../../../src/data/lovelace/config/card";
-import type { LovelaceConfig } from "../../../../src/data/lovelace/config/types";
+import { LovelaceCardConfig } from "../../../../src/data/lovelace/config/card";
+import { LovelaceConfig } from "../../../../src/data/lovelace/config/types";
 import { castContext } from "../cast_context";
 
 export const castDemoLovelace: () => LovelaceConfig = () => {

cast/src/receiver/entrypoint.ts

@@ -1,10 +1,10 @@
 import { framework } from "./cast_framework";
 import { CAST_NS } from "../../../src/cast/const";
-import type { HassMessage } from "../../../src/cast/receiver_messages";
+import { HassMessage } from "../../../src/cast/receiver_messages";
 import "../../../src/resources/custom-card-support";
 import { castContext } from "./cast_context";
 import { HcMain } from "./layout/hc-main";
-import type { ReceivedMessage } from "./types";
+import { ReceivedMessage } from "./types";
 
 const lovelaceController = new HcMain();
 document.body.append(lovelaceController);

cast/src/receiver/layout/hc-demo.ts

@@ -1,11 +1,13 @@
 import { html, nothing } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import { mockHistory } from "../../../../demo/src/stubs/history";
-import type { LovelaceConfig } from "../../../../src/data/lovelace/config/types";
-import type { MockHomeAssistant } from "../../../../src/fake_data/provide_hass";
-import { provideHass } from "../../../../src/fake_data/provide_hass";
+import { LovelaceConfig } from "../../../../src/data/lovelace/config/types";
+import {
+  MockHomeAssistant,
+  provideHass,
+} from "../../../../src/fake_data/provide_hass";
 import { HassElement } from "../../../../src/state/hass-element";
-import type { HomeAssistant } from "../../../../src/types";
+import { HomeAssistant } from "../../../../src/types";
 import { castDemoEntities } from "../demo/cast-demo-entities";
 import { castDemoLovelace } from "../demo/cast-demo-lovelace";
 import "./hc-lovelace";

cast/src/receiver/layout/hc-launch-screen.ts

@@ -1,7 +1,6 @@
-import type { CSSResultGroup, TemplateResult } from "lit";
-import { css, html, LitElement } from "lit";
+import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
 import { customElement, property } from "lit/decorators";
-import type { HomeAssistant } from "../../../../src/types";
+import { HomeAssistant } from "../../../../src/types";
 
 @customElement("hc-launch-screen")
 class HcLaunchScreen extends LitElement {

cast/src/receiver/layout/hc-lovelace.ts

@@ -1,18 +1,11 @@
-import {
-  css,
-  type CSSResultGroup,
-  html,
-  LitElement,
-  type TemplateResult,
-} from "lit";
-import { customElement, property } from "lit/decorators";
+import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
+import { customElement, property, query } from "lit/decorators";
 import { fireEvent } from "../../../../src/common/dom/fire_event";
-import type { LovelaceConfig } from "../../../../src/data/lovelace/config/types";
+import { LovelaceConfig } from "../../../../src/data/lovelace/config/types";
 import { getPanelTitleFromUrlPath } from "../../../../src/data/panel";
-import type { Lovelace } from "../../../../src/panels/lovelace/types";
+import { Lovelace } from "../../../../src/panels/lovelace/types";
 import "../../../../src/panels/lovelace/views/hui-view";
-import "../../../../src/panels/lovelace/views/hui-view-container";
-import type { HomeAssistant } from "../../../../src/types";
+import { HomeAssistant } from "../../../../src/types";
 import "./hc-launch-screen";
 
 (window as any).loadCardHelpers = () =>
@@ -29,6 +22,8 @@ class HcLovelace extends LitElement {
 
   @property() public urlPath: string | null = null;
 
+  @query("hui-view") private _huiView?: HTMLElement;
+
   protected render(): TemplateResult {
     const index = this._viewIndex;
     if (index === undefined) {
@@ -50,24 +45,13 @@ class HcLovelace extends LitElement {
       saveConfig: async () => undefined,
       deleteConfig: async () => undefined,
       setEditMode: () => undefined,
-      showToast: () => undefined,
     };
-
-    const viewConfig = this.lovelaceConfig.views[index];
-    const background = viewConfig.background || this.lovelaceConfig.background;
-
     return html`
-      <hui-view-container
+      <hui-view
         .hass=${this.hass}
-        .background=${background}
-        .theme=${viewConfig.theme}
-      >
-        <hui-view
-          .hass=${this.hass}
-          .lovelace=${lovelace}
-          .index=${index}
-        ></hui-view>
-      </hui-view-container>
+        .lovelace=${lovelace}
+        .index=${index}
+      ></hui-view>
     `;
   }
 
@@ -97,6 +81,26 @@ class HcLovelace extends LitElement {
                 }${viewTitle || ""}`
               : undefined,
         });
+
+        const configBackground =
+          this.lovelaceConfig.views[index].background ||
+          this.lovelaceConfig.background;
+
+        const backgroundStyle =
+          typeof configBackground === "string"
+            ? configBackground
+            : configBackground?.image
+              ? `center / cover no-repeat url('${configBackground.image}')`
+              : undefined;
+
+        if (backgroundStyle) {
+          this._huiView!.style.setProperty(
+            "--lovelace-background",
+            backgroundStyle
+          );
+        } else {
+          this._huiView!.style.removeProperty("--lovelace-background");
+        }
       }
     }
   }
@@ -120,15 +124,19 @@ class HcLovelace extends LitElement {
 
   static get styles(): CSSResultGroup {
     return css`
-      hui-view-container {
-        display: flex;
-        position: relative;
+      :host {
         min-height: 100vh;
+        height: 0;
+        display: flex;
+        flex-direction: column;
         box-sizing: border-box;
+        background: var(--primary-background-color);
+      }
+      :host > * {
+        flex: 1;
       }
       hui-view {
-        flex: 1 1 100%;
-        max-width: 100%;
+        background: var(--lovelace-background, var(--primary-background-color));
       }
     `;
   }

cast/src/receiver/layout/hc-main.ts

@@ -1,33 +1,35 @@
-import type { UnsubscribeFunc } from "home-assistant-js-websocket";
-import { createConnection, getAuth } from "home-assistant-js-websocket";
-import type { TemplateResult } from "lit";
-import { html } from "lit";
+import {
+  createConnection,
+  getAuth,
+  UnsubscribeFunc,
+} from "home-assistant-js-websocket";
+import { html, TemplateResult } from "lit";
 import { customElement, state } from "lit/decorators";
 import { CAST_NS } from "../../../../src/cast/const";
-import type {
+import {
   ConnectMessage,
   GetStatusMessage,
   HassMessage,
   ShowDemoMessage,
   ShowLovelaceViewMessage,
 } from "../../../../src/cast/receiver_messages";
-import type {
+import {
+  ReceiverErrorCode,
   ReceiverErrorMessage,
   ReceiverStatusMessage,
 } from "../../../../src/cast/sender_messages";
-import { ReceiverErrorCode } from "../../../../src/cast/sender_messages";
 import { atLeastVersion } from "../../../../src/common/config/version";
 import { isNavigationClick } from "../../../../src/common/dom/is-navigation-click";
 import {
   getLegacyLovelaceCollection,
   getLovelaceCollection,
 } from "../../../../src/data/lovelace";
-import type {
+import {
+  isStrategyDashboard,
   LegacyLovelaceConfig,
   LovelaceConfig,
   LovelaceDashboardStrategyConfig,
 } from "../../../../src/data/lovelace/config/types";
-import { isStrategyDashboard } from "../../../../src/data/lovelace/config/types";
 import { fetchResources } from "../../../../src/data/lovelace/resource";
 import { loadLovelaceResources } from "../../../../src/panels/lovelace/common/load-resources";
 import { HassElement } from "../../../../src/state/hass-element";

demo/src/configs/arsaboo/entities.ts

@@ -1,5 +1,5 @@
 import { convertEntities } from "../../../../src/fake_data/entity";
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 
 export const demoEntitiesArsaboo: DemoConfig["entities"] = (localize) =>
   convertEntities({

demo/src/configs/arsaboo/index.ts

@@ -1,4 +1,4 @@
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 import { demoEntitiesArsaboo } from "./entities";
 import { demoLovelaceArsaboo } from "./lovelace";
 import { demoThemeArsaboo } from "./theme";

demo/src/configs/arsaboo/lovelace.ts

@@ -1,4 +1,4 @@
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 
 export const demoLovelaceArsaboo: DemoConfig["lovelace"] = (localize) => ({
   title: "Home Assistant",

demo/src/configs/demo-configs.ts

@@ -1,7 +1,7 @@
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
-import type { Lovelace } from "../../../src/panels/lovelace/types";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { Lovelace } from "../../../src/panels/lovelace/types";
 import { energyEntities } from "../stubs/entities";
-import type { DemoConfig } from "./types";
+import { DemoConfig } from "./types";
 
 export const demoConfigs: Array<() => Promise<DemoConfig>> = [
   () => import("./sections").then((mod) => mod.demoSections),

demo/src/configs/jimpower/entities.ts

@@ -1,5 +1,5 @@
 import { convertEntities } from "../../../../src/fake_data/entity";
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 
 export const demoEntitiesJimpower: DemoConfig["entities"] = () =>
   convertEntities({

demo/src/configs/jimpower/index.ts

@@ -1,4 +1,4 @@
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 import { demoEntitiesJimpower } from "./entities";
 import { demoLovelaceJimpower } from "./lovelace";
 import { demoThemeJimpower } from "./theme";

demo/src/configs/jimpower/lovelace.ts

@@ -1,5 +1,5 @@
 import "../../custom-cards/card-modder";
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 
 export const demoLovelaceJimpower: DemoConfig["lovelace"] = () => ({
   name: "Kingia Castle",

demo/src/configs/kernehed/entities.ts

@@ -1,5 +1,5 @@
 import { convertEntities } from "../../../../src/fake_data/entity";
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 
 export const demoEntitiesKernehed: DemoConfig["entities"] = () =>
   convertEntities({

demo/src/configs/kernehed/index.ts

@@ -1,4 +1,4 @@
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 import { demoEntitiesKernehed } from "./entities";
 import { demoLovelaceKernehed } from "./lovelace";
 import { demoThemeKernehed } from "./theme";

demo/src/configs/kernehed/lovelace.ts

@@ -1,4 +1,4 @@
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 
 export const demoLovelaceKernehed: DemoConfig["lovelace"] = () => ({
   name: "Hem",

demo/src/configs/sections/description.ts

@@ -0,0 +1,16 @@
+import { html } from "lit";
+import { DemoConfig } from "../types";
+
+export const demoLovelaceDescription: DemoConfig["description"] = (
+  localize
+) => html`
+  <p>
+    ${localize("ui.panel.page-demo.config.sections.description", {
+      blog_post: html`<a
+        href="https://www.home-assistant.io/blog/2024/03/04/dashboard-chapter-1/"
+        target="_blank"
+        >${localize("ui.panel.page-demo.config.sections.description_blog_post")}
+      </a>`,
+    })}
+  </p>
+`;

demo/src/configs/sections/entities.ts

@@ -1,5 +1,5 @@
 import { convertEntities } from "../../../../src/fake_data/entity";
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 
 export const demoEntitiesSections: DemoConfig["entities"] = (localize) =>
   convertEntities({

demo/src/configs/sections/index.ts

@@ -1,4 +1,5 @@
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
+import { demoLovelaceDescription } from "./description";
 import { demoEntitiesSections } from "./entities";
 import { demoLovelaceSections } from "./lovelace";
 
@@ -6,6 +7,7 @@ export const demoSections: DemoConfig = {
   authorName: "Home Assistant",
   authorUrl: "https://github.com/home-assistant/frontend/",
   name: "Home Demo",
+  description: demoLovelaceDescription,
   lovelace: demoLovelaceSections,
   entities: demoEntitiesSections,
   theme: () => ({}),

demo/src/configs/sections/lovelace.ts

@@ -1,5 +1,5 @@
 import { isFrontpageEmbed } from "../../util/is_frontpage";
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 
 export const demoLovelaceSections: DemoConfig["lovelace"] = (localize) => ({
   title: "Home Assistant Demo",

demo/src/configs/teachingbirds/entities.ts

@@ -1,5 +1,5 @@
 import { convertEntities } from "../../../../src/fake_data/entity";
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 
 export const demoEntitiesTeachingbirds: DemoConfig["entities"] = () =>
   convertEntities({

demo/src/configs/teachingbirds/index.ts

@@ -1,4 +1,4 @@
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 import { demoEntitiesTeachingbirds } from "./entities";
 import { demoLovelaceTeachingbirds } from "./lovelace";
 import { demoThemeTeachingbirds } from "./theme";

demo/src/configs/teachingbirds/lovelace.ts

@@ -1,4 +1,4 @@
-import type { DemoConfig } from "../types";
+import { DemoConfig } from "../types";
 
 export const demoLovelaceTeachingbirds: DemoConfig["lovelace"] = () => ({
   title: "Home",

demo/src/configs/types.ts

@@ -1,7 +1,7 @@
-import type { TemplateResult } from "lit";
-import type { LocalizeFunc } from "../../../src/common/translations/localize";
-import type { LovelaceConfig } from "../../../src/data/lovelace/config/types";
-import type { Entity } from "../../../src/fake_data/entity";
+import { TemplateResult } from "lit";
+import { LocalizeFunc } from "../../../src/common/translations/localize";
+import { LovelaceConfig } from "../../../src/data/lovelace/config/types";
+import { Entity } from "../../../src/fake_data/entity";
 
 export interface DemoConfig {
   index?: number;

demo/src/custom-cards/cast-demo-row.ts

@@ -1,15 +1,14 @@
 import { mdiTelevision } from "@mdi/js";
-import type { CSSResultGroup } from "lit";
-import { css, html, LitElement, nothing } from "lit";
+import { css, CSSResultGroup, html, LitElement, nothing } from "lit";
 import { customElement, state } from "lit/decorators";
-import type { CastManager } from "../../../src/cast/cast_manager";
+import { CastManager } from "../../../src/cast/cast_manager";
 import { castSendShowDemo } from "../../../src/cast/receiver_messages";
 import "../../../src/components/ha-icon";
-import type {
+import {
   CastConfig,
   LovelaceRow,
 } from "../../../src/panels/lovelace/entity-rows/types";
-import type { HomeAssistant } from "../../../src/types";
+import { HomeAssistant } from "../../../src/types";
 
 @customElement("cast-demo-row")
 class CastDemoRow extends LitElement implements LovelaceRow {

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

@@ -1,17 +1,13 @@
-import type { CSSResultGroup } from "lit";
-import { css, html, LitElement, nothing } from "lit";
+import { css, CSSResultGroup, html, LitElement, nothing } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import { until } from "lit/directives/until";
 import { fireEvent } from "../../../src/common/dom/fire_event";
 import "../../../src/components/ha-card";
 import "../../../src/components/ha-button";
 import "../../../src/components/ha-circular-progress";
-import type { LovelaceCardConfig } from "../../../src/data/lovelace/config/card";
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
-import type {
-  Lovelace,
-  LovelaceCard,
-} from "../../../src/panels/lovelace/types";
+import { LovelaceCardConfig } from "../../../src/data/lovelace/config/card";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { Lovelace, LovelaceCard } from "../../../src/panels/lovelace/types";
 import {
   demoConfigs,
   selectedDemoConfig,

demo/src/ha-demo.ts

@@ -3,10 +3,12 @@ import "../../src/resources/compatibility";
 import { customElement } from "lit/decorators";
 import { isNavigationClick } from "../../src/common/dom/is-navigation-click";
 import { navigate } from "../../src/common/navigate";
-import type { MockHomeAssistant } from "../../src/fake_data/provide_hass";
-import { provideHass } from "../../src/fake_data/provide_hass";
+import {
+  MockHomeAssistant,
+  provideHass,
+} from "../../src/fake_data/provide_hass";
 import { HomeAssistantAppEl } from "../../src/layouts/home-assistant";
-import type { HomeAssistant } from "../../src/types";
+import { HomeAssistant } from "../../src/types";
 import { selectedDemoConfig } from "./configs/demo-configs";
 import { mockAreaRegistry } from "./stubs/area_registry";
 import { mockAuth } from "./stubs/auth";

demo/src/stubs/area_registry.ts

@@ -1,4 +1,4 @@
-import type { AreaRegistryEntry } from "../../../src/data/area_registry";
+import { AreaRegistryEntry } from "../../../src/data/area_registry";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockAreaRegistry = (

demo/src/stubs/auth.ts

@@ -1,4 +1,4 @@
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockAuth = (hass: MockHomeAssistant) => {
   hass.mockWS("config/auth/list", () => []);

demo/src/stubs/config.ts

@@ -1,4 +1,4 @@
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockConfig = (hass: MockHomeAssistant) => {
   hass.mockWS("validate_config", () => ({

demo/src/stubs/config_entries.ts

@@ -1,4 +1,4 @@
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockConfigEntries = (hass: MockHomeAssistant) => {
   hass.mockWS("config_entries/get", () => ({

demo/src/stubs/device_registry.ts

@@ -1,4 +1,4 @@
-import type { DeviceRegistryEntry } from "../../../src/data/device_registry";
+import { DeviceRegistryEntry } from "../../../src/data/device_registry";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockDeviceRegistry = (

demo/src/stubs/energy.ts

@@ -1,11 +1,11 @@
 import { format, startOfToday, startOfTomorrow } from "date-fns";
-import type {
+import {
   EnergyInfo,
   EnergyPreferences,
   EnergySolarForecasts,
   FossilEnergyConsumption,
 } from "../../../src/data/energy";
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockEnergy = (hass: MockHomeAssistant) => {
   hass.mockWS(

demo/src/stubs/entity_registry.ts

@@ -1,4 +1,4 @@
-import type { EntityRegistryEntry } from "../../../src/data/entity_registry";
+import { EntityRegistryEntry } from "../../../src/data/entity_registry";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockEntityRegistry = (

demo/src/stubs/events.ts

@@ -1,4 +1,4 @@
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockEvents = (hass: MockHomeAssistant) => {
   hass.mockAPI("events", () => []);

demo/src/stubs/floor_registry.ts

@@ -1,4 +1,4 @@
-import type { FloorRegistryEntry } from "../../../src/data/floor_registry";
+import { FloorRegistryEntry } from "../../../src/data/floor_registry";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockFloorRegistry = (

demo/src/stubs/frontend.ts

@@ -1,4 +1,4 @@
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockFrontend = (hass: MockHomeAssistant) => {
   hass.mockWS("frontend/get_user_data", () => ({

demo/src/stubs/hassio_supervisor.ts

@@ -1,4 +1,4 @@
-import type { HassioSupervisorInfo } from "../../../src/data/hassio/supervisor";
+import { HassioSupervisorInfo } from "../../../src/data/hassio/supervisor";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockHassioSupervisor = (hass: MockHomeAssistant) => {

demo/src/stubs/history.ts

@@ -1,6 +1,6 @@
-import type { HassEntity } from "home-assistant-js-websocket";
-import type { HistoryStates } from "../../../src/data/history";
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { HassEntity } from "home-assistant-js-websocket";
+import { HistoryStates } from "../../../src/data/history";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 const generateStateHistory = (
   state: HassEntity,

demo/src/stubs/icons.ts

@@ -1,6 +1,6 @@
-import type { IconCategory } from "../../../src/data/icons";
+import { IconCategory } from "../../../src/data/icons";
 import { ENTITY_COMPONENT_ICONS } from "../../../src/fake_data/entity_component_icons";
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockIcons = (hass: MockHomeAssistant) => {
   hass.mockWS(

demo/src/stubs/label_registry.ts

@@ -1,4 +1,4 @@
-import type { LabelRegistryEntry } from "../../../src/data/label_registry";
+import { LabelRegistryEntry } from "../../../src/data/label_registry";
 import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockLabelRegistry = (

demo/src/stubs/media_player.ts

@@ -1,4 +1,4 @@
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockMediaPlayer = (hass: MockHomeAssistant) => {
   hass.mockWS("media_player_thumbnail", () => Promise.reject());

demo/src/stubs/persistent_notification.ts

@@ -1,5 +1,5 @@
-import type { PersistentNotificationMessage } from "../../../src/data/persistent_notification";
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { PersistentNotificationMessage } from "../../../src/data/persistent_notification";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockPersistentNotification = (hass: MockHomeAssistant) => {
   hass.mockWS("persistent_notification/subscribe", (_msg, _hass, onChange) => {

demo/src/stubs/recorder.ts

@@ -5,12 +5,12 @@ import {
   differenceInHours,
   endOfDay,
 } from "date-fns";
-import type {
+import {
   Statistics,
   StatisticsMetaData,
   StatisticValue,
 } from "../../../src/data/recorder";
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 const generateMeanStatistics = (
   start: Date,

demo/src/stubs/sensor.ts

@@ -1,4 +1,4 @@
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockSensor = (hass: MockHomeAssistant) => {
   hass.mockWS("sensor/numeric_device_classes", () => [

demo/src/stubs/system_log.ts

@@ -1,4 +1,4 @@
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockSystemLog = (hass: MockHomeAssistant) => {
   hass.mockAPI("error/all", () => []);

demo/src/stubs/tags.ts

@@ -1,5 +1,5 @@
-import type { Tag } from "../../../src/data/tag";
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { Tag } from "../../../src/data/tag";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockTags = (hass: MockHomeAssistant) => {
   hass.mockWS("tag/list", () => [{ id: "my-tag", name: "My Tag" }] as Tag[]);

demo/src/stubs/template.ts

@@ -1,4 +1,4 @@
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockTemplate = (hass: MockHomeAssistant) => {
   hass.mockAPI("template", () =>

demo/src/stubs/todo.ts

@@ -1,6 +1,5 @@
-import type { TodoItem } from "../../../src/data/todo";
-import { TodoItemStatus } from "../../../src/data/todo";
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { TodoItem, TodoItemStatus } from "../../../src/data/todo";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockTodo = (hass: MockHomeAssistant) => {
   hass.mockWS("todo/item/list", () => ({

demo/src/stubs/translations.ts

@@ -1,4 +1,4 @@
-import type { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
+import { MockHomeAssistant } from "../../../src/fake_data/provide_hass";
 
 export const mockTranslations = (hass: MockHomeAssistant) => {
   hass.mockWS(

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

@@ -1,7 +1,5 @@
-import "@material/mwc-button/mwc-button";
-import type { Button } from "@material/mwc-button";
-import type { TemplateResult } from "lit";
-import { html, LitElement, css, nothing } from "lit";
+import { Button } from "@material/mwc-button";
+import { html, LitElement, css, TemplateResult, nothing } from "lit";
 import { customElement, property } from "lit/decorators";
 import { applyThemesOnElement } from "../../../src/common/dom/apply_themes_on_element";
 import { fireEvent } from "../../../src/common/dom/fire_event";

gallery/src/components/demo-card.ts

@@ -1,11 +1,10 @@
 import { load } from "js-yaml";
-import type { PropertyValueMap } from "lit";
-import { LitElement, css, html, nothing } from "lit";
+import { LitElement, PropertyValueMap, css, html, nothing } from "lit";
 import { customElement, property, query, state } from "lit/decorators";
 import memoizeOne from "memoize-one";
 import "../../../src/panels/lovelace/cards/hui-card";
 import type { HuiCard } from "../../../src/panels/lovelace/cards/hui-card";
-import type { HomeAssistant } from "../../../src/types";
+import { HomeAssistant } from "../../../src/types";
 
 export interface DemoCardConfig {
   heading: string;

gallery/src/components/demo-cards.ts

@@ -3,7 +3,7 @@ import { customElement, property, query, state } from "lit/decorators";
 import { applyThemesOnElement } from "../../../src/common/dom/apply_themes_on_element";
 import "../../../src/components/ha-formfield";
 import "../../../src/components/ha-switch";
-import type { HomeAssistant } from "../../../src/types";
+import { HomeAssistant } from "../../../src/types";
 import "./demo-card";
 import type { DemoCardConfig } from "./demo-card";
 import "../ha-demo-options";

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

@@ -4,7 +4,7 @@ import "../../../src/components/ha-card";
 import "../../../src/dialogs/more-info/more-info-content";
 import "../../../src/state-summary/state-card-content";
 import "../ha-demo-options";
-import type { HomeAssistant } from "../../../src/types";
+import { HomeAssistant } from "../../../src/types";
 
 @customElement("demo-more-info")
 class DemoMoreInfo extends LitElement {

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

@@ -3,7 +3,7 @@ import { customElement, property, state } from "lit/decorators";
 import { applyThemesOnElement } from "../../../src/common/dom/apply_themes_on_element";
 import "../../../src/components/ha-formfield";
 import "../../../src/components/ha-switch";
-import type { HomeAssistant } from "../../../src/types";
+import { HomeAssistant } from "../../../src/types";
 import "../ha-demo-options";
 import "./demo-more-info";
 

gallery/src/data/traces/basic_trace.ts

@@ -1,4 +1,4 @@
-import type { DemoTrace } from "./types";
+import { DemoTrace } from "./types";
 
 export const basicTrace: DemoTrace = {
   trace: {

gallery/src/data/traces/mock-demo-trace.ts

@@ -1,6 +1,6 @@
-import type { LogbookEntry } from "../../../../src/data/logbook";
-import type { AutomationTraceExtended } from "../../../../src/data/trace";
-import type { DemoTrace } from "./types";
+import { LogbookEntry } from "../../../../src/data/logbook";
+import { AutomationTraceExtended } from "../../../../src/data/trace";
+import { DemoTrace } from "./types";
 
 export const mockDemoTrace = (
   tracePartial: Partial<AutomationTraceExtended>,

gallery/src/data/traces/motion-light-trace.ts

@@ -1,4 +1,4 @@
-import type { DemoTrace } from "./types";
+import { DemoTrace } from "./types";
 
 export const motionLightTrace: DemoTrace = {
   trace: {

gallery/src/data/traces/types.ts

@@ -1,5 +1,5 @@
-import type { AutomationTraceExtended } from "../../../../src/data/trace";
-import type { LogbookEntry } from "../../../../src/data/logbook";
+import { AutomationTraceExtended } from "../../../../src/data/trace";
+import { LogbookEntry } from "../../../../src/data/logbook";
 
 export interface DemoTrace {
   trace: AutomationTraceExtended;

gallery/src/ha-gallery.ts

@@ -1,8 +1,7 @@
 import "@material/mwc-drawer";
 import "@material/mwc-top-app-bar-fixed";
 import { mdiMenu } from "@mdi/js";
-import type { PropertyValues } from "lit";
-import { LitElement, css, html } from "lit";
+import { LitElement, PropertyValues, css, html } from "lit";
 import { customElement, query, state } from "lit/decorators";
 import { dynamicElement } from "../../src/common/dom/dynamic-element-directive";
 import { HaExpansionPanel } from "../../src/components/ha-expansion-panel";

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

@@ -3,11 +3,11 @@ import { css, html, LitElement, nothing } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import "../../../../src/components/ha-card";
 import "../../../../src/components/ha-yaml-editor";
-import type { Action } from "../../../../src/data/script";
+import { Action } from "../../../../src/data/script";
 import { describeAction } from "../../../../src/data/script_i18n";
 import { getEntity } from "../../../../src/fake_data/entity";
 import { provideHass } from "../../../../src/fake_data/provide_hass";
-import type { HomeAssistant } from "../../../../src/types";
+import { HomeAssistant } from "../../../../src/types";
 
 const ENTITIES = [
   getEntity("scene", "kitchen_morning", "scening", {
@@ -142,7 +142,7 @@ export class DemoAutomationDescribeAction extends LitElement {
         <div class="action">
           <span>
             ${this._action
-              ? describeAction(this.hass, [], [], {}, this._action)
+              ? describeAction(this.hass, [], [], this._action)
               : "<invalid YAML>"}
           </span>
           <ha-yaml-editor
@@ -155,7 +155,7 @@ export class DemoAutomationDescribeAction extends LitElement {
         ${ACTIONS.map(
           (conf) => html`
             <div class="action">
-              <span>${describeAction(this.hass, [], [], {}, conf as any)}</span>
+              <span>${describeAction(this.hass, [], [], conf as any)}</span>
               <pre>${dump(conf)}</pre>
             </div>
           `

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

@@ -3,11 +3,11 @@ import { css, html, LitElement, nothing } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import "../../../../src/components/ha-card";
 import "../../../../src/components/ha-yaml-editor";
-import type { Condition } from "../../../../src/data/automation";
+import { Condition } from "../../../../src/data/automation";
 import { describeCondition } from "../../../../src/data/automation_i18n";
 import { getEntity } from "../../../../src/fake_data/entity";
 import { provideHass } from "../../../../src/fake_data/provide_hass";
-import type { HomeAssistant } from "../../../../src/types";
+import { HomeAssistant } from "../../../../src/types";
 
 const ENTITIES = [
   getEntity("light", "kitchen", "on", {

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

@@ -3,11 +3,11 @@ import { css, html, LitElement, nothing } from "lit";
 import { customElement, property, state } from "lit/decorators";
 import "../../../../src/components/ha-card";
 import "../../../../src/components/ha-yaml-editor";
-import type { Trigger } from "../../../../src/data/automation";
+import { Trigger } from "../../../../src/data/automation";
 import { describeTrigger } from "../../../../src/data/automation_i18n";
 import { getEntity } from "../../../../src/fake_data/entity";
 import { provideHass } from "../../../../src/fake_data/provide_hass";
-import type { HomeAssistant } from "../../../../src/types";
+import { HomeAssistant } from "../../../../src/types";
 
 const ENTITIES = [
   getEntity("light", "kitchen", "on", {

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

@@ -1,6 +1,5 @@
 /* eslint-disable lit/no-template-arrow */
-import type { TemplateResult } from "lit";
-import { LitElement, html, css } from "lit";
+import { LitElement, TemplateResult, html, css } from "lit";
 import { customElement, state } from "lit/decorators";
 import { provideHass } from "../../../../src/fake_data/provide_hass";
 import type { HomeAssistant } from "../../../../src/types";
@@ -19,7 +18,7 @@ import { HaSceneAction } from "../../../../src/panels/config/automation/action/t
 import { HaServiceAction } from "../../../../src/panels/config/automation/action/types/ha-automation-action-service";
 import { HaWaitForTriggerAction } from "../../../../src/panels/config/automation/action/types/ha-automation-action-wait_for_trigger";
 import { HaWaitAction } from "../../../../src/panels/config/automation/action/types/ha-automation-action-wait_template";
-import type { Action } from "../../../../src/data/script";
+import { Action } from "../../../../src/data/script";
 import { HaConditionAction } from "../../../../src/panels/config/automation/action/types/ha-automation-action-condition";
 import { HaSequenceAction } from "../../../../src/panels/config/automation/action/types/ha-automation-action-sequence";
 import { HaParallelAction } from "../../../../src/panels/config/automation/action/types/ha-automation-action-parallel";

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

@@ -1,6 +1,5 @@
 /* eslint-disable lit/no-template-arrow */
-import type { TemplateResult } from "lit";
-import { LitElement, html, css } from "lit";
+import { LitElement, TemplateResult, html, css } from "lit";
 import { customElement, state } from "lit/decorators";
 import { provideHass } from "../../../../src/fake_data/provide_hass";
 import type { HomeAssistant } from "../../../../src/types";

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

@@ -1,6 +1,5 @@
 /* eslint-disable lit/no-template-arrow */
-import type { TemplateResult } from "lit";
-import { LitElement, html, css } from "lit";
+import { LitElement, TemplateResult, html, css } from "lit";
 import { customElement, state } from "lit/decorators";
 import { provideHass } from "../../../../src/fake_data/provide_hass";
 import type { HomeAssistant } from "../../../../src/types";

gallery/src/pages/automation/trace-timeline.ts

@@ -5,9 +5,9 @@ import { customElement, property } from "lit/decorators";
 import "../../../../src/components/ha-card";
 import "../../../../src/components/trace/hat-trace-timeline";
 import { provideHass } from "../../../../src/fake_data/provide_hass";
-import type { HomeAssistant } from "../../../../src/types";
+import { HomeAssistant } from "../../../../src/types";
 import { mockDemoTrace } from "../../data/traces/mock-demo-trace";
-import type { DemoTrace } from "../../data/traces/types";
+import { DemoTrace } from "../../data/traces/types";
 
 const traces: DemoTrace[] = [
   mockDemoTrace({ state: "running" }),

gallery/src/pages/automation/trace.ts

@@ -6,10 +6,10 @@ import "../../../../src/components/ha-card";
 import "../../../../src/components/trace/hat-script-graph";
 import "../../../../src/components/trace/hat-trace-timeline";
 import { provideHass } from "../../../../src/fake_data/provide_hass";
-import type { HomeAssistant } from "../../../../src/types";
+import { HomeAssistant } from "../../../../src/types";
 import { basicTrace } from "../../data/traces/basic_trace";
 import { motionLightTrace } from "../../data/traces/motion-light-trace";
-import type { DemoTrace } from "../../data/traces/types";
+import { DemoTrace } from "../../data/traces/types";
 
 const traces: DemoTrace[] = [basicTrace, motionLightTrace];
 

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

@@ -1,6 +1,5 @@
 import "@material/mwc-button/mwc-button";
-import type { TemplateResult } from "lit";
-import { css, html, LitElement } from "lit";
+import { css, html, LitElement, TemplateResult } from "lit";
 import { customElement } from "lit/decorators";
 import { applyThemesOnElement } from "../../../../src/common/dom/apply_themes_on_element";
 import "../../../../src/components/ha-alert";

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

@@ -1,5 +1,4 @@
-import type { TemplateResult } from "lit";
-import { html, css, LitElement } from "lit";
+import { html, css, LitElement, TemplateResult } from "lit";
 import { customElement } from "lit/decorators";
 import { classMap } from "lit/directives/class-map";
 import "../../../../src/components/ha-bar";

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

@@ -1,5 +1,4 @@
-import type { TemplateResult } from "lit";
-import { css, html, LitElement, nothing } from "lit";
+import { css, html, LitElement, TemplateResult, nothing } from "lit";
 import { customElement } from "lit/decorators";
 import "../../../../src/components/ha-card";
 import "../../../../src/components/chips/ha-chip-set";

gallery/src/pages/components/ha-circular-progress.ts

@@ -1,11 +1,10 @@
-import type { TemplateResult } from "lit";
-import { html, css, LitElement } from "lit";
+import { html, css, LitElement, TemplateResult } from "lit";
 import { customElement, property } from "lit/decorators";
 import "../../../../src/components/ha-bar";
 import "../../../../src/components/ha-card";
 import "../../../../src/components/ha-circular-progress";
 import "@material/web/progress/circular-progress";
-import type { HomeAssistant } from "../../../../src/types";
+import { HomeAssistant } from "../../../../src/types";
 
 @customElement("demo-components-ha-circular-progress")
 export class DemoHaCircularProgress extends LitElement {

gallery/src/pages/components/ha-control-button.ts

@@ -4,8 +4,7 @@ import {
   mdiFanSpeed3,
   mdiLightbulb,
 } from "@mdi/js";
-import type { TemplateResult } from "lit";
-import { css, html, LitElement } from "lit";
+import { css, html, LitElement, TemplateResult } from "lit";
 import { customElement } from "lit/decorators";
 import { ifDefined } from "lit/directives/if-defined";
 import { repeat } from "lit/directives/repeat";

gallery/src/pages/components/ha-control-circular-slider.ts

@@ -1,5 +1,4 @@
-import type { TemplateResult } from "lit";
-import { css, html, LitElement } from "lit";
+import { css, html, LitElement, TemplateResult } from "lit";
 import { customElement, state } from "lit/decorators";
 import "../../../../src/components/ha-card";
 import "../../../../src/components/ha-control-circular-slider";

gallery/src/pages/components/ha-control-number-buttons.ts

@@ -1,5 +1,4 @@
-import type { TemplateResult } from "lit";
-import { LitElement, css, html } from "lit";
+import { LitElement, TemplateResult, css, html } from "lit";
 import { customElement, state } from "lit/decorators";
 import "../../../../src/components/ha-card";
 import "../../../../src/components/ha-control-number-buttons";

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

@@ -1,6 +1,5 @@
 import { mdiFan, mdiFanSpeed1, mdiFanSpeed2, mdiFanSpeed3 } from "@mdi/js";
-import type { TemplateResult } from "lit";
-import { LitElement, css, html, nothing } from "lit";
+import { LitElement, TemplateResult, css, html, nothing } from "lit";
 import { customElement } from "lit/decorators";
 import { repeat } from "lit/directives/repeat";
 import "../../../../src/components/ha-card";

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

@@ -1,6 +1,5 @@
 import { mdiFanOff, mdiFanSpeed1, mdiFanSpeed2, mdiFanSpeed3 } from "@mdi/js";
-import type { TemplateResult } from "lit";
-import { css, html, LitElement } from "lit";
+import { css, html, LitElement, TemplateResult } from "lit";
 import { customElement, state } from "lit/decorators";
 import { ifDefined } from "lit/directives/if-defined";
 import { repeat } from "lit/directives/repeat";

gallery/src/pages/components/ha-control-slider.ts

@@ -1,5 +1,4 @@
-import type { TemplateResult } from "lit";
-import { css, html, LitElement } from "lit";
+import { css, html, LitElement, TemplateResult } from "lit";
 import { customElement, state } from "lit/decorators";
 import { ifDefined } from "lit/directives/if-defined";
 import { repeat } from "lit/directives/repeat";

gallery/src/pages/components/ha-control-switch.ts

@@ -4,8 +4,7 @@ import {
   mdiLightbulb,
   mdiLightbulbOff,
 } from "@mdi/js";
-import type { TemplateResult } from "lit";
-import { css, html, LitElement } from "lit";
+import { css, html, LitElement, TemplateResult } from "lit";
 import { customElement, state } from "lit/decorators";
 import { ifDefined } from "lit/directives/if-defined";
 import { repeat } from "lit/directives/repeat";

gallery/src/pages/components/ha-expansion-panel.ts

@@ -1,6 +1,5 @@
 import { mdiPacMan } from "@mdi/js";
-import type { TemplateResult } from "lit";
-import { css, html, LitElement } from "lit";
+import { css, html, LitElement, TemplateResult } from "lit";
 import { customElement } from "lit/decorators";
 import "../../../../src/components/ha-card";
 import "../../../../src/components/ha-expansion-panel";