Update dependency marked to v16.4.0 (#27436)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

package.json

@@ -34,7 +34,7 @@
     "@codemirror/legacy-modes": "6.5.2",
     "@codemirror/search": "6.5.11",
     "@codemirror/state": "6.5.2",
-    "@codemirror/view": "6.38.4",
+    "@codemirror/view": "6.38.5",
     "@date-fns/tz": "1.4.1",
     "@egjs/hammerjs": "2.0.17",
     "@formatjs/intl-datetimeformat": "6.18.1",
@@ -52,7 +52,7 @@
     "@fullcalendar/list": "6.1.19",
     "@fullcalendar/luxon3": "6.1.19",
     "@fullcalendar/timegrid": "6.1.19",
-    "@home-assistant/webawesome": "3.0.0-beta.6.ha.1",
+    "@home-assistant/webawesome": "3.0.0-beta.6.ha.4",
     "@lezer/highlight": "1.2.1",
     "@lit-labs/motion": "1.0.9",
     "@lit-labs/observers": "2.0.6",
@@ -122,7 +122,7 @@
     "lit": "3.3.1",
     "lit-html": "3.3.1",
     "luxon": "3.7.2",
-    "marked": "16.3.0",
+    "marked": "16.4.0",
     "memoize-one": "6.0.0",
     "node-vibrant": "4.0.3",
     "object-hash": "3.0.0",
@@ -217,7 +217,7 @@
     "terser-webpack-plugin": "5.3.14",
     "ts-lit-plugin": "2.0.2",
     "typescript": "5.9.3",
-    "typescript-eslint": "8.45.0",
+    "typescript-eslint": "8.46.0",
     "vite-tsconfig-paths": "5.1.4",
     "vitest": "3.2.4",
     "webpack-stats-plugin": "1.1.3",

renovate.json

@@ -9,7 +9,7 @@
     ":semanticCommitsDisabled",
     "group:monorepos",
     "group:recommended",
-    "npm:unpublishSafe"
+    "security:minimumReleaseAgeNpm"
   ],
   "enabledManagers": ["npm", "nvm"],
   "postUpdateOptions": ["yarnDedupeHighest"],

src/common/util/xss.ts

@@ -0,0 +1,8 @@
+import xss from "xss";
+
+export const filterXSS = (html: string) =>
+  xss(html, {
+    whiteList: {},
+    stripIgnoreTag: true,
+    stripIgnoreTagBody: true,
+  });

src/components/chart/ha-chart-base.ts

@@ -27,6 +27,7 @@ import type { HomeAssistant } from "../../types";
 import { isMac } from "../../util/is_mac";
 import "../chips/ha-assist-chip";
 import "../ha-icon-button";
+import { filterXSS } from "../../common/util/xss";
 import { formatTimeLabel } from "./axis-label";
 import { downSampleLineData } from "./down-sample";
 
@@ -811,7 +812,8 @@ export class HaChartBase extends LitElement {
           };
         }
       }
-      return { ...s, data };
+      const name = filterXSS(String(s.name ?? s.id ?? ""));
+      return { ...s, name, data };
     });
     return series as ECOption["series"];
   }

src/components/chart/ha-sankey-chart.ts

@@ -9,6 +9,7 @@ import { ResizeController } from "@lit-labs/observers/resize-controller";
 import type { HomeAssistant } from "../../types";
 import type { ECOption } from "../../resources/echarts";
 import { measureTextWidth } from "../../util/text";
+import { filterXSS } from "../../common/util/xss";
 import "./ha-chart-base";
 import { NODE_SIZE } from "../trace/hat-graph-const";
 import "../ha-alert";
@@ -92,12 +93,12 @@ export class HaSankeyChart extends LitElement {
       : data.value;
     if (data.id) {
       const node = this.data.nodes.find((n) => n.id === data.id);
-      return `${params.marker} ${node?.label ?? data.id}<br>${value}`;
+      return `${params.marker} ${filterXSS(node?.label ?? data.id)}<br>${value}`;
     }
     if (data.source && data.target) {
       const source = this.data.nodes.find((n) => n.id === data.source);
       const target = this.data.nodes.find((n) => n.id === data.target);
-      return `${source?.label ?? data.source} → ${target?.label ?? data.target}<br>${value}`;
+      return `${filterXSS(source?.label ?? data.source)} → ${filterXSS(target?.label ?? data.target)}<br>${value}`;
     }
     return null;
   };

src/components/ha-dialog-header.ts

@@ -40,7 +40,6 @@ export class HaDialogHeader extends LitElement {
       css`
         :host {
           display: block;
-          min-height: 48px;
         }
         :host([show-border]) {
           border-bottom: 1px solid

src/components/ha-picture-upload.ts

@@ -39,6 +39,15 @@ export class HaPictureUpload extends LitElement {
   @property({ type: Boolean, attribute: "select-media" }) public selectMedia =
     false;
 
+  // This property is set when this component is used inside a media selector.
+  // When set, it returns selected media or uploaded files as MediaSelectorValue
+  // When unset, it only allows selecting images from image-upload, and returns
+  // selected or uploaded images as a string starting with /api/...
+  @property({ type: Boolean, attribute: "full-media" }) public fullMedia =
+    false;
+
+  @property({ attribute: false }) public contentIdHelper?: string;
+
   @property({ attribute: false }) public cropOptions?: CropOptions;
 
   @property({ type: Boolean }) public original = false;
@@ -164,12 +173,33 @@ export class HaPictureUpload extends LitElement {
     this._uploading = true;
     try {
       const media = await createImage(this.hass, file);
-      this.value = generateImageThumbnailUrl(
-        media.id,
-        this.size,
-        this.original
-      );
-      fireEvent(this, "change");
+      if (this.fullMedia) {
+        const item = {
+          media_content_id: `${MEDIA_PREFIX}/${media.id}`,
+          media_content_type: media.content_type,
+          title: media.name,
+          media_class: "image" as const,
+          can_play: true,
+          can_expand: false,
+          can_search: false,
+          thumbnail: generateImageThumbnailUrl(media.id, 256),
+        } as const;
+        const navigateIds = [
+          {},
+          { media_content_type: "app", media_content_id: MEDIA_PREFIX },
+        ];
+        fireEvent(this, "media-picked", {
+          item,
+          navigateIds,
+        });
+      } else {
+        this.value = generateImageThumbnailUrl(
+          media.id,
+          this.size,
+          this.original
+        );
+        fireEvent(this, "change");
+      }
     } catch (err: any) {
       showAlertDialog(this, {
         text: err.toString(),
@@ -183,15 +213,24 @@ export class HaPictureUpload extends LitElement {
     showMediaBrowserDialog(this, {
       action: "pick",
       entityId: "browser",
-      navigateIds: [
-        { media_content_id: undefined, media_content_type: undefined },
-        {
-          media_content_id: MEDIA_PREFIX,
-          media_content_type: "app",
-        },
-      ],
-      minimumNavigateLevel: 2,
+      accept: ["image/*"],
+      navigateIds: this.fullMedia
+        ? undefined
+        : [
+            { media_content_id: undefined, media_content_type: undefined },
+            {
+              media_content_id: MEDIA_PREFIX,
+              media_content_type: "app",
+            },
+          ],
+      minimumNavigateLevel: this.fullMedia ? undefined : 2,
+      hideContentType: true,
+      contentIdHelper: this.contentIdHelper,
       mediaPickedCallback: async (pickedMedia: MediaPickedEvent) => {
+        if (this.fullMedia) {
+          fireEvent(this, "media-picked", pickedMedia);
+          return;
+        }
         const mediaId = getIdFromUrl(pickedMedia.item.media_content_id);
         if (mediaId) {
           if (this.crop) {

src/components/ha-resizable-bottom-sheet.ts

@@ -220,7 +220,7 @@ export class HaResizableBottomSheet extends LitElement {
       min-height: var(--min-height, 30dvh);
       background-color: var(
         --ha-bottom-sheet-surface-background,
-        var(--ha-dialog-surface-background, var(--mdc-theme-surface, #fff)),
+        var(--ha-color-surface-default)
       );
       display: flex;
       flex-direction: column;

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

@@ -19,6 +19,7 @@ import "../ha-form/ha-form";
 import type { SchemaUnion } from "../ha-form/types";
 import { showMediaBrowserDialog } from "../media-player/show-media-browser-dialog";
 import { ensureArray } from "../../common/array/ensure-array";
+import "../ha-picture-upload";
 
 const MANUAL_SCHEMA = [
   { name: "media_content_id", required: false, selector: { text: {} } },
@@ -105,6 +106,17 @@ export class HaMediaSelector extends LitElement {
       (stateObj &&
         supportsFeature(stateObj, MediaPlayerEntityFeature.BROWSE_MEDIA));
 
+    if (this.selector.media?.image_upload && !this.value) {
+      return html`<ha-picture-upload
+        .hass=${this.hass}
+        .value=${null}
+        .contentIdHelper=${this.selector.media?.content_id_helper}
+        select-media
+        full-media
+        @media-picked=${this._pictureUploadMediaPicked}
+      ></ha-picture-upload>`;
+    }
+
     return html`
       ${this._hasAccept ||
       (this._contextEntities && this._contextEntities.length <= 1)
@@ -142,8 +154,7 @@ export class HaMediaSelector extends LitElement {
               .computeHelper=${this._computeHelperCallback}
             ></ha-form>
           `
-        : html`
-            <ha-card
+        : html`<ha-card
               outlined
               tabindex="0"
               role="button"
@@ -203,7 +214,20 @@ export class HaMediaSelector extends LitElement {
                 </div>
               </div>
             </ha-card>
-          `}
+            ${this.selector.media?.clearable
+              ? html`<div>
+                  <ha-button
+                    appearance="plain"
+                    size="small"
+                    variant="danger"
+                    @click=${this._clearValue}
+                  >
+                    ${this.hass.localize(
+                      "ui.components.picture-upload.clear_picture"
+                    )}
+                  </ha-button>
+                </div>`
+              : nothing}`}
     `;
   }
 
@@ -248,6 +272,8 @@ export class HaMediaSelector extends LitElement {
       accept: this.selector.media?.accept,
       defaultId: this.value?.media_content_id,
       defaultType: this.value?.media_content_type,
+      hideContentType: this.selector.media?.hide_content_type,
+      contentIdHelper: this.selector.media?.content_id_helper,
       mediaPickedCallback: (pickedMedia: MediaPickedEvent) => {
         fireEvent(this, "value-changed", {
           value: {
@@ -289,6 +315,31 @@ export class HaMediaSelector extends LitElement {
     }
   }
 
+  private _pictureUploadMediaPicked(ev) {
+    const pickedMedia = ev.detail as MediaPickedEvent;
+    fireEvent(this, "value-changed", {
+      value: {
+        ...this.value,
+        media_content_id: pickedMedia.item.media_content_id,
+        media_content_type: pickedMedia.item.media_content_type,
+        metadata: {
+          title: pickedMedia.item.title,
+          thumbnail: pickedMedia.item.thumbnail,
+          media_class: pickedMedia.item.media_class,
+          children_media_class: pickedMedia.item.children_media_class,
+          navigateIds: pickedMedia.navigateIds?.map((id) => ({
+            media_content_type: id.media_content_type,
+            media_content_id: id.media_content_id,
+          })),
+        },
+      },
+    });
+  }
+
+  private _clearValue() {
+    fireEvent(this, "value-changed", { value: undefined });
+  }
+
   static styles = css`
     ha-entity-picker {
       display: block;

src/components/ha-sidebar.ts

@@ -857,7 +857,7 @@ class HaSidebar extends SubscribeMixin(LitElement) {
           justify-content: center;
           align-items: center;
           min-width: 8px;
-          border-radius: var(--ha-border-radius-md);
+          border-radius: var(--ha-border-radius-xl);
           font-weight: var(--ha-font-weight-normal);
           line-height: normal;
           background-color: var(--accent-color);

src/components/media-player/dialog-media-player-browse.ts

@@ -167,6 +167,8 @@ class DialogMediaPlayerBrowse extends LitElement {
           .accept=${this._params.accept}
           .defaultId=${this._params.defaultId}
           .defaultType=${this._params.defaultType}
+          .hideContentType=${this._params.hideContentType}
+          .contentIdHelper=${this._params.contentIdHelper}
           @close-dialog=${this.closeDialog}
           @media-picked=${this._mediaPicked}
           @media-browsed=${this._mediaBrowsed}

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

@@ -19,8 +19,12 @@ class BrowseMediaManual extends LitElement {
 
   @property({ attribute: false }) public item!: MediaPlayerItemId;
 
+  @property({ attribute: false }) public hideContentType = false;
+
+  @property({ attribute: false }) public contentIdHelper?: string;
+
   private _schema = memoizeOne(
-    () =>
+    (hideContentType: boolean) =>
       [
         {
           name: "media_content_id",
@@ -29,13 +33,17 @@ class BrowseMediaManual extends LitElement {
             text: {},
           },
         },
-        {
-          name: "media_content_type",
-          required: false,
-          selector: {
-            text: {},
-          },
-        },
+        ...(hideContentType
+          ? []
+          : [
+              {
+                name: "media_content_type",
+                required: false,
+                selector: {
+                  text: {},
+                },
+              },
+            ]),
       ] as const
   );
 
@@ -45,7 +53,7 @@ class BrowseMediaManual extends LitElement {
         <div class="card-content">
           <ha-form
             .hass=${this.hass}
-            .schema=${this._schema()}
+            .schema=${this._schema(this.hideContentType)}
             .data=${this.item}
             .computeLabel=${this._computeLabel}
             .computeHelper=${this._computeHelper}
@@ -69,13 +77,35 @@ class BrowseMediaManual extends LitElement {
 
   private _computeLabel = (
     entry: SchemaUnion<ReturnType<typeof this._schema>>
-  ): string =>
-    this.hass.localize(`ui.components.selectors.media.${entry.name}`);
+  ): string => {
+    switch (entry.name) {
+      case "media_content_id":
+      case "media_content_type":
+        return this.hass.localize(
+          `ui.components.selectors.media.${entry.name}`
+        );
+    }
+    return entry.name;
+  };
 
   private _computeHelper = (
     entry: SchemaUnion<ReturnType<typeof this._schema>>
-  ): string =>
-    this.hass.localize(`ui.components.selectors.media.${entry.name}_detail`);
+  ): string => {
+    switch (entry.name) {
+      case "media_content_id":
+        return (
+          this.contentIdHelper ||
+          this.hass.localize(
+            `ui.components.selectors.media.${entry.name}_detail`
+          )
+        );
+      case "media_content_type":
+        return this.hass.localize(
+          `ui.components.selectors.media.${entry.name}_detail`
+        );
+    }
+    return "";
+  };
 
   private _mediaPicked() {
     fireEvent(this, "manual-media-picked", {

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

@@ -76,8 +76,8 @@ declare global {
 }
 
 export interface MediaPlayerItemId {
-  media_content_id: string | undefined;
-  media_content_type: string | undefined;
+  media_content_id?: string | undefined;
+  media_content_type?: string | undefined;
 }
 
 const MANUAL_ITEM: MediaPlayerItem = {
@@ -113,6 +113,10 @@ export class HaMediaPlayerBrowse extends LitElement {
 
   @property({ attribute: false }) public defaultType?: string;
 
+  @property({ attribute: false }) public hideContentType = false;
+
+  @property({ attribute: false }) public contentIdHelper?: string;
+
   // @todo Consider reworking to eliminate need for attribute since it is manipulated internally
   @property({ type: Boolean, reflect: true }) public narrow = false;
 
@@ -521,6 +525,8 @@ export class HaMediaPlayerBrowse extends LitElement {
                         media_content_type: this.defaultType || "",
                       }}
                       .hass=${this.hass}
+                      .hideContentType=${this.hideContentType}
+                      .contentIdHelper=${this.contentIdHelper}
                       @manual-media-picked=${this._manualPicked}
                     ></ha-browse-media-manual>`
                   : isTTSMediaSource(currentItem.media_content_id)

src/components/media-player/show-media-browser-dialog.ts

@@ -14,6 +14,8 @@ export interface MediaPlayerBrowseDialogParams {
   accept?: string[];
   defaultId?: string;
   defaultType?: string;
+  hideContentType?: boolean;
+  contentIdHelper?: string;
 }
 
 export const showMediaBrowserDialog = (

src/data/recorder.ts

@@ -95,7 +95,9 @@ export interface StatisticsValidationResultUnitsChanged {
   data: {
     statistic_id: string;
     state_unit: string;
+    state_unit_class: string | null;
     metadata_unit: string;
+    metadata_unit_class: string | null;
     supported_unit: string;
   };
 }
@@ -231,12 +233,14 @@ export const validateStatistics = (hass: HomeAssistant) =>
 export const updateStatisticsMetadata = (
   hass: HomeAssistant,
   statistic_id: string,
-  unit_of_measurement: string | null
+  unit_of_measurement: string | null,
+  unit_class: string | null
 ) =>
   hass.callWS<undefined>({
     type: "recorder/update_statistics_metadata",
     statistic_id,
     unit_of_measurement,
+    unit_class,
   });
 
 export const clearStatistics = (hass: HomeAssistant, statistic_ids: string[]) =>

src/data/selector.ts

@@ -312,6 +312,10 @@ export interface LocationSelectorValue {
 export interface MediaSelector {
   media: {
     accept?: string[];
+    image_upload?: boolean;
+    clearable?: boolean;
+    hide_content_type?: boolean;
+    content_id_helper?: string;
   } | null;
 }
 

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

@@ -167,15 +167,12 @@ class MoreInfoMediaPlayer extends LitElement {
     }
 
     return html`<ha-md-button-menu positioning="popover">
-      <ha-button
+      <ha-icon-button
         slot="trigger"
-        appearance="plain"
-        variant="neutral"
-        size="small"
-        title=${this.hass.localize(`ui.card.media_player.source`)}
+        .title=${this.hass.localize(`ui.card.media_player.source`)}
+        .path=${mdiLoginVariant}
       >
-        <ha-svg-icon .path=${mdiLoginVariant}></ha-svg-icon>
-      </ha-button>
+      </ha-icon-button>
       ${this.stateObj.attributes.source_list!.map(
         (source) =>
           html`<ha-md-menu-item
@@ -203,15 +200,12 @@ class MoreInfoMediaPlayer extends LitElement {
     }
 
     return html`<ha-md-button-menu positioning="popover">
-      <ha-button
+      <ha-icon-button
         slot="trigger"
-        appearance="plain"
-        variant="neutral"
-        size="small"
-        title=${this.hass.localize(`ui.card.media_player.sound_mode`)}
+        .title=${this.hass.localize(`ui.card.media_player.sound_mode`)}
+        .path=${mdiMusicNoteEighth}
       >
-        <ha-svg-icon .path=${mdiMusicNoteEighth}></ha-svg-icon>
-      </ha-button>
+      </ha-icon-button>
       ${this.stateObj.attributes.sound_mode_list!.map(
         (soundMode) =>
           html`<ha-md-menu-item
@@ -237,21 +231,17 @@ class MoreInfoMediaPlayer extends LitElement {
     const groupMembers = this.stateObj.attributes.group_members;
     const hasMultipleMembers = groupMembers && groupMembers?.length > 1;
 
-    return html`<ha-button
-      class="grouping"
+    return html`<ha-icon-button
       @click=${this._showGroupMediaPlayers}
-      appearance="plain"
-      variant="neutral"
-      size="small"
-      title=${this.hass.localize("ui.card.media_player.join")}
+      .title=${this.hass.localize("ui.card.media_player.join")}
     >
-      <div>
+      <div class="grouping">
         <ha-svg-icon .path=${mdiSpeakerMultiple}></ha-svg-icon>
         ${hasMultipleMembers
-          ? html`<span class="badge"> ${groupMembers?.length || 4} </span>`
+          ? html`<span class="badge">${groupMembers?.length || 4}</span>`
           : nothing}
       </div>
-    </ha-button>`;
+    </ha-icon-button>`;
   }
 
   protected _renderEmptyCover(title: string, icon?: string) {
@@ -414,48 +404,39 @@ class MoreInfoMediaPlayer extends LitElement {
           ${!isUnavailableState(stateObj.state) &&
           supportsFeature(stateObj, MediaPlayerEntityFeature.BROWSE_MEDIA)
             ? html`
-                <ha-button
+                <ha-icon-button
                   @click=${this._showBrowseMedia}
-                  appearance="plain"
-                  variant="neutral"
-                  size="small"
-                  title=${this.hass.localize(
+                  .title=${this.hass.localize(
                     "ui.card.media_player.browse_media"
                   )}
+                  .path=${mdiPlayBoxMultiple}
                 >
-                  <ha-svg-icon .path=${mdiPlayBoxMultiple}></ha-svg-icon>
-                </ha-button>
+                </ha-icon-button>
               `
             : nothing}
           ${this._renderGrouping()} ${this._renderSourceControl()}
           ${this._renderSoundMode()}
           ${turnOn
-            ? html`<ha-button
+            ? html`<ha-icon-button
                 action=${turnOn.action}
                 @click=${this._handleClick}
-                appearance="plain"
-                variant="neutral"
-                size="small"
-                title=${this.hass.localize(
+                .title=${this.hass.localize(
                   `ui.card.media_player.${turnOn.action}`
                 )}
+                .path=${turnOn.icon}
               >
-                <ha-svg-icon .path=${turnOn.icon}></ha-svg-icon>
-              </ha-button>`
+              </ha-icon-button>`
             : nothing}
           ${turnOff
-            ? html`<ha-button
+            ? html`<ha-icon-button
                 action=${turnOff.action}
                 @click=${this._handleClick}
-                appearance="plain"
-                variant="neutral"
-                size="small"
-                title=${this.hass.localize(
+                .title=${this.hass.localize(
                   `ui.card.media_player.${turnOff.action}`
                 )}
+                .path=${turnOff.icon}
               >
-                <ha-svg-icon .path=${turnOff.icon}></ha-svg-icon>
-              </ha-button>`
+              </ha-icon-button>`
             : nothing}
         </div>
       </div>
@@ -579,7 +560,7 @@ class MoreInfoMediaPlayer extends LitElement {
       font-size: var(--ha-font-size-xs);
       background-color: var(--primary-color);
       padding: 0 4px;
-      color: var(--primary-text-color);
+      color: var(--text-primary-color);
     }
 
     .position-bar {
@@ -616,15 +597,15 @@ class MoreInfoMediaPlayer extends LitElement {
       justify-content: space-around;
     }
 
-    .controls-row ha-button {
-      width: 32px;
+    .controls-row ha-icon-button {
+      color: var(--secondary-text-color);
     }
 
     .controls-row ha-svg-icon {
       color: var(--ha-color-on-neutral-quiet);
     }
 
-    .grouping::part(label) {
+    .grouping {
       position: relative;
     }
 

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

@@ -302,6 +302,8 @@ export default class HaAutomationSidebar extends LitElement {
       --ha-bottom-sheet-border-style: solid;
       --ha-bottom-sheet-border-color: var(--primary-color);
       margin-top: var(--safe-area-inset-top);
+
+      --ha-bottom-sheet-surface-background: var(--card-background-color);
     }
 
     @media all and (max-width: 870px) {

src/panels/config/backup/components/config/ha-backup-config-data.ts

@@ -11,7 +11,6 @@ import { customElement, property, state } from "lit/decorators";
 import memoizeOne from "memoize-one";
 import { isComponentLoaded } from "../../../../../common/config/is_component_loaded";
 import { fireEvent } from "../../../../../common/dom/fire_event";
-import "../../../../../components/ha-alert";
 import "../../../../../components/ha-button";
 import "../../../../../components/ha-expansion-panel";
 import "../../../../../components/ha-md-list";
@@ -19,14 +18,10 @@ import "../../../../../components/ha-md-list-item";
 import "../../../../../components/ha-md-select";
 import type { HaMdSelect } from "../../../../../components/ha-md-select";
 import "../../../../../components/ha-md-select-option";
-import "../../../../../components/ha-spinner";
 import "../../../../../components/ha-switch";
 import type { HaSwitch } from "../../../../../components/ha-switch";
 import { fetchHassioAddonsInfo } from "../../../../../data/hassio/addon";
-import type { HostDisksUsage } from "../../../../../data/hassio/host";
-import { fetchHostDisksUsage } from "../../../../../data/hassio/host";
 import type { HomeAssistant } from "../../../../../types";
-import { bytesToString } from "../../../../../util/bytes-to-string";
 import "../ha-backup-addons-picker";
 import type { BackupAddonItem } from "../ha-backup-addons-picker";
 import { getRecorderInfo } from "../../../../../data/recorder";
@@ -83,14 +78,11 @@ class HaBackupConfigData extends LitElement {
 
   @state() private _showDbOption = true;
 
-  @state() private _storageInfo?: HostDisksUsage | null;
-
   protected firstUpdated(changedProperties: PropertyValues): void {
     super.firstUpdated(changedProperties);
     this._checkDbOption();
     if (isComponentLoaded(this.hass, "hassio")) {
       this._fetchAddons();
-      this._fetchStorageInfo();
     }
   }
 
@@ -122,63 +114,10 @@ class HaBackupConfigData extends LitElement {
     }
   }
 
-  private async _fetchStorageInfo() {
-    try {
-      this._storageInfo = await fetchHostDisksUsage(this.hass);
-    } catch (_err: any) {
-      this._storageInfo = null;
-    }
-  }
-
   private _hasLocalAddons(addons: BackupAddonItem[]): boolean {
     return addons.some((addon) => addon.slug === "local");
   }
 
-  private _estimateBackupSize(data: FormData): {
-    uncompressedBytes: number;
-    compressedBytes: number;
-    addonsNotAccurate: boolean;
-  } | null {
-    if (!this._storageInfo?.children) {
-      return null;
-    }
-
-    let totalBytes = 0;
-
-    const segments: Record<string, number> = {};
-    this._storageInfo.children.forEach((child) => {
-      segments[child.id] = child.used_bytes;
-    });
-
-    if (data.homeassistant) {
-      totalBytes += segments.homeassistant ?? 0;
-    }
-    if (data.media) {
-      totalBytes += segments.media ?? 0;
-    }
-    if (data.share) {
-      totalBytes += segments.share ?? 0;
-    }
-
-    if (
-      data.addons_mode === "all" ||
-      (data.addons_mode === "custom" && data.addons.length > 0)
-    ) {
-      // It would be better if we could receive individual addon sizes in the WS request instead
-      totalBytes += (segments.addons_data ?? 0) + (segments.addons_config ?? 0);
-    }
-
-    return {
-      uncompressedBytes: totalBytes,
-      // Estimate compressed size (40% reduction typical for gzip)
-      compressedBytes: Math.round(totalBytes * 0.6),
-      addonsNotAccurate:
-        data.addons_mode === "custom" &&
-        data.addons.length > 0 &&
-        data.addons.length !== this._addons.length,
-    };
-  }
-
   private _getData = memoizeOne(
     (value: BackupConfigData | undefined, showAddon: boolean): FormData => {
       if (!value) {
@@ -232,7 +171,6 @@ class HaBackupConfigData extends LitElement {
     const isHassio = isComponentLoaded(this.hass, "hassio");
 
     return html`
-      ${this._renderSizeEstimate()}
       <ha-md-list>
         <ha-md-list-item>
           <ha-svg-icon slot="start" .path=${mdiCog}></ha-svg-icon>
@@ -443,79 +381,7 @@ class HaBackupConfigData extends LitElement {
     });
   }
 
-  private _renderSizeEstimate() {
-    if (!isComponentLoaded(this.hass, "hassio")) {
-      return nothing;
-    }
-
-    const data = this._getData(this.value, this._showAddons);
-
-    if (
-      !(
-        data.homeassistant ||
-        data.database ||
-        data.media ||
-        data.share ||
-        data.local_addons ||
-        data.addons_mode === "all" ||
-        (data.addons_mode === "custom" && data.addons.length > 0)
-      )
-    ) {
-      return nothing;
-    }
-
-    if (this._storageInfo === undefined) {
-      return html`
-        <ha-alert alert-type="info">
-          <ha-spinner slot="icon"></ha-spinner>
-          ${this.hass.localize(
-            "ui.panel.config.backup.data.estimated_size_loading"
-          )}</ha-alert
-        >
-      `;
-    }
-
-    if (!this._storageInfo || !this._storageInfo.children) {
-      return nothing;
-    }
-
-    const result = this._estimateBackupSize(data);
-    if (result === null) {
-      return nothing;
-    }
-
-    const { uncompressedBytes, compressedBytes, addonsNotAccurate } = result;
-
-    return html`
-      <ha-alert alert-type="info">
-        ${this.hass.localize("ui.panel.config.backup.data.estimated_size", {
-          uncompressed: bytesToString(uncompressedBytes),
-          compressed: bytesToString(compressedBytes),
-        })}
-        <br />
-        <span style="font-size: 0.9em; opacity: 0.8;">
-          ${this.hass.localize(
-            "ui.panel.config.backup.data.estimated_size_disclaimer"
-          )}
-          ${addonsNotAccurate
-            ? html`<br />${this.hass.localize(
-                  "ui.panel.config.backup.data.estimated_size_disclaimer_addons_custom"
-                )}`
-            : nothing}
-        </span>
-      </ha-alert>
-    `;
-  }
-
   static styles = css`
-    ha-alert {
-      display: block;
-      margin-top: var(--ha-space-2);
-      --ha-alert-icon-size: 24px;
-    }
-    ha-alert ha-spinner {
-      --ha-spinner-size: 24px;
-    }
     ha-md-list {
       background: none;
       --md-list-item-leading-space: 0;

src/panels/config/backup/dialogs/dialog-generate-backup.ts

@@ -1,7 +1,7 @@
 import { mdiClose } from "@mdi/js";
 import type { CSSResultGroup, PropertyValues } from "lit";
 import { css, html, LitElement, nothing } from "lit";
-import { customElement, property, query, state } from "lit/decorators";
+import { customElement, property, state } from "lit/decorators";
 import { isComponentLoaded } from "../../../../common/config/is_component_loaded";
 import { fireEvent } from "../../../../common/dom/fire_event";
 import "../../../../components/ha-alert";
@@ -9,9 +9,9 @@ import "../../../../components/ha-button";
 import "../../../../components/ha-dialog-header";
 import "../../../../components/ha-expansion-panel";
 import "../../../../components/ha-icon-button";
+import "../../../../components/ha-dialog-footer";
 import "../../../../components/ha-icon-button-prev";
-import "../../../../components/ha-md-dialog";
-import type { HaMdDialog } from "../../../../components/ha-md-dialog";
+import "../../../../components/ha-wa-dialog";
 import "../../../../components/ha-md-list";
 import "../../../../components/ha-md-list-item";
 import "../../../../components/ha-md-select";
@@ -73,12 +73,13 @@ class DialogGenerateBackup extends LitElement implements HassDialog {
 
   @state() private _formData?: FormData;
 
-  @query("ha-md-dialog") private _dialog?: HaMdDialog;
+  @state() private _open = false;
 
   public showDialog(_params: GenerateBackupDialogParams): void {
     this._step = STEPS[0];
     this._formData = INITIAL_DATA;
     this._params = _params;
+    this._open = true;
 
     this._fetchAgents();
     this._fetchBackupConfig();
@@ -88,6 +89,7 @@ class DialogGenerateBackup extends LitElement implements HassDialog {
     if (this._params!.cancel) {
       this._params!.cancel();
     }
+    this._open = false;
     this._step = undefined;
     this._formData = undefined;
     this._agents = [];
@@ -114,7 +116,7 @@ class DialogGenerateBackup extends LitElement implements HassDialog {
   }
 
   public closeDialog() {
-    this._dialog?.close();
+    this._open = false;
     return true;
   }
 
@@ -179,15 +181,19 @@ class DialogGenerateBackup extends LitElement implements HassDialog {
     const selectedAgents = this._formData.agent_ids;
 
     return html`
-      <ha-md-dialog open disable-cancel-action @closed=${this._dialogClosed}>
-        <ha-dialog-header slot="headline">
+      <ha-wa-dialog
+        .hass=${this.hass}
+        .open=${this._open}
+        @closed=${this._dialogClosed}
+      >
+        <ha-dialog-header slot="header">
           ${isFirstStep
             ? html`
                 <ha-icon-button
                   slot="navigationIcon"
+                  data-dialog="close"
                   .label=${this.hass.localize("ui.common.close")}
                   .path=${mdiClose}
-                  @click=${this.closeDialog}
                 ></ha-icon-button>
               `
             : html`
@@ -198,13 +204,17 @@ class DialogGenerateBackup extends LitElement implements HassDialog {
               `}
           <span slot="title" .title=${dialogTitle}> ${dialogTitle} </span>
         </ha-dialog-header>
-        <div slot="content" class="content">
+        <div class="content">
           ${this._step === "data" ? this._renderData() : this._renderSync()}
         </div>
-        <div slot="actions">
+        <ha-dialog-footer slot="footer">
           ${isFirstStep
             ? html`
-                <ha-button @click=${this.closeDialog} appearance="plain">
+                <ha-button
+                  slot="secondaryAction"
+                  @click=${this.closeDialog}
+                  appearance="plain"
+                >
                   ${this.hass.localize("ui.common.cancel")}
                 </ha-button>
               `
@@ -212,6 +222,7 @@ class DialogGenerateBackup extends LitElement implements HassDialog {
           ${isLastStep
             ? html`
                 <ha-button
+                  slot="primaryAction"
                   @click=${this._submit}
                   .disabled=${this._formData.agents_mode === "custom" &&
                   !selectedAgents.length}
@@ -223,14 +234,15 @@ class DialogGenerateBackup extends LitElement implements HassDialog {
               `
             : html`
                 <ha-button
+                  slot="primaryAction"
                   @click=${this._nextStep}
                   .disabled=${this._step === "data" && this._noDataSelected}
                 >
                   ${this.hass.localize("ui.common.next")}
                 </ha-button>
               `}
-        </div>
-      </ha-md-dialog>
+        </ha-dialog-footer>
+      </ha-wa-dialog>
     `;
   }
 
@@ -436,9 +448,8 @@ class DialogGenerateBackup extends LitElement implements HassDialog {
       haStyle,
       haStyleDialog,
       css`
-        ha-md-dialog {
+        ha-wa-dialog {
           --dialog-content-padding: 24px;
-          max-height: calc(100vh - 48px);
         }
         ha-md-list {
           background: none;

src/panels/config/storage/dialog-move-datadisk.ts

@@ -110,7 +110,7 @@ class MoveDatadiskDialog extends LitElement {
       >
         ${this._moving
           ? html`
-              <ha-spinner aria-label="Moving" size="large"> </ha-spinner>
+              <ha-spinner aria-label="Moving" size="large"></ha-spinner>
               <p class="progress-text">
                 ${this.hass.localize(
                   "ui.panel.config.storage.datadisk.moving_desc"
@@ -206,8 +206,7 @@ class MoveDatadiskDialog extends LitElement {
         }
         ha-spinner {
           display: block;
-          margin: 32px;
-          text-align: center;
+          margin: 32px auto;
         }
 
         .progress-text {

src/panels/developer-tools/statistics/dialog-statistics-fix-units-changed.ts

@@ -139,7 +139,8 @@ export class DialogStatisticsFixUnitsChanged extends LitElement {
       await updateStatisticsMetadata(
         this.hass,
         this._params!.issue.data.statistic_id,
-        this._params!.issue.data.state_unit
+        this._params!.issue.data.state_unit,
+        this._params!.issue.data.state_unit_class
       );
     }
     this._params?.fixedCallback!();

src/panels/lovelace/cards/energy/common/energy-chart-options.ts

@@ -27,6 +27,7 @@ import {
 } from "../../../../../common/datetime/format_date";
 import { formatTime } from "../../../../../common/datetime/format_time";
 import type { ECOption } from "../../../../../resources/echarts";
+import { filterXSS } from "../../../../../common/util/xss";
 
 export function getSuggestedMax(dayDifference: number, end: Date): number {
   let suggestedMax = new Date(end);
@@ -201,7 +202,7 @@ function formatTooltip(
           countNegative++;
         }
       }
-      return `${param.marker} ${param.seriesName}: ${value} ${unit}`;
+      return `${param.marker} ${filterXSS(param.seriesName!)}: ${value} ${unit}`;
     })
     .filter(Boolean);
   let footer = "";

src/panels/lovelace/cards/energy/hui-energy-devices-graph-card.ts

@@ -6,6 +6,7 @@ import { classMap } from "lit/directives/class-map";
 import memoizeOne from "memoize-one";
 import type { BarSeriesOption } from "echarts/charts";
 import type { ECElementEvent } from "echarts/types/dist/shared";
+import { filterXSS } from "../../../../common/util/xss";
 import { getGraphColorByIndex } from "../../../../common/color/colors";
 import { formatNumber } from "../../../../common/number/format_number";
 import "../../../../components/chart/ha-chart-base";
@@ -96,9 +97,8 @@ export class HuiEnergyDevicesGraphCard
   }
 
   private _renderTooltip(params: any) {
-    const title = `<h4 style="text-align: center; margin: 0;">${this._getDeviceName(
-      params.value[1]
-    )}</h4>`;
+    const deviceName = filterXSS(this._getDeviceName(params.value[1]));
+    const title = `<h4 style="text-align: center; margin: 0;">${deviceName}</h4>`;
     const value = `${formatNumber(
       params.value[0] as number,
       this.hass.locale,

src/panels/lovelace/cards/hui-picture-card.ts

@@ -93,17 +93,21 @@ export class HuiPictureCard extends LitElement implements LovelaceCard {
       changedProps.has("_config") &&
       changedProps.get("_config")?.image !== this._config?.image;
 
+    const image =
+      (typeof this._config?.image === "object" &&
+        this._config.image.media_content_id) ||
+      (this._config.image as string | undefined);
     if (
       (firstHass || imageChanged) &&
-      typeof this._config?.image === "string" &&
-      isMediaSourceContentId(this._config.image)
+      typeof image === "string" &&
+      isMediaSourceContentId(image)
     ) {
       this._resolvedImage = undefined;
-      resolveMediaSource(this.hass, this._config?.image).then((result) => {
+      resolveMediaSource(this.hass, image).then((result) => {
         this._resolvedImage = result.url;
       });
     } else if (imageChanged) {
-      this._resolvedImage = this._config?.image;
+      this._resolvedImage = image;
     }
   }
 

src/panels/lovelace/cards/types.ts

@@ -29,6 +29,7 @@ import type {
 import type { LovelaceHeaderFooterConfig } from "../header-footer/types";
 import type { LovelaceHeadingBadgeConfig } from "../heading-badges/types";
 import type { HomeSummary } from "../strategies/home/helpers/home-summaries";
+import type { MediaSelectorValue } from "../../../data/selector";
 
 export type AlarmPanelCardConfigState =
   | "arm_away"
@@ -441,7 +442,7 @@ export interface StatisticCardConfig extends LovelaceCardConfig {
 }
 
 export interface PictureCardConfig extends LovelaceCardConfig {
-  image?: string;
+  image?: string | MediaSelectorValue;
   image_entity?: string;
   tap_action?: ActionConfig;
   hold_action?: ActionConfig;

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

@@ -1,7 +1,8 @@
 import { mdiGestureTap } from "@mdi/js";
 import { html, LitElement, nothing } from "lit";
 import { customElement, property, state } from "lit/decorators";
-import { assert, assign, object, optional, string } from "superstruct";
+import { assert, assign, object, optional, string, union } from "superstruct";
+import memoizeOne from "memoize-one";
 import { fireEvent } from "../../../../common/dom/fire_event";
 import type { SchemaUnion } from "../../../../components/ha-form/types";
 import "../../../../components/ha-theme-picker";
@@ -11,11 +12,12 @@ import "../../components/hui-action-editor";
 import type { LovelaceCardEditor } from "../../types";
 import { actionConfigStruct } from "../structs/action-struct";
 import { baseLovelaceCardConfig } from "../structs/base-card-struct";
+import type { LocalizeFunc } from "../../../../common/translations/localize";
 
 const cardConfigStruct = assign(
   baseLovelaceCardConfig,
   object({
-    image: optional(string()),
+    image: optional(union([string(), object()])),
     image_entity: optional(string()),
     tap_action: optional(actionConfigStruct),
     hold_action: optional(actionConfigStruct),
@@ -25,47 +27,6 @@ const cardConfigStruct = assign(
   })
 );
 
-const SCHEMA = [
-  { name: "image", selector: { image: {} } },
-  {
-    name: "image_entity",
-    selector: { entity: { domain: ["image", "person"] } },
-  },
-  { name: "alt_text", selector: { text: {} } },
-  { name: "theme", selector: { theme: {} } },
-  {
-    name: "interactions",
-    type: "expandable",
-    flatten: true,
-    iconPath: mdiGestureTap,
-    schema: [
-      {
-        name: "tap_action",
-        selector: {
-          ui_action: {
-            default_action: "more-info",
-          },
-        },
-      },
-      {
-        name: "",
-        type: "optional_actions",
-        flatten: true,
-        schema: (["hold_action", "double_tap_action"] as const).map(
-          (action) => ({
-            name: action,
-            selector: {
-              ui_action: {
-                default_action: "none" as const,
-              },
-            },
-          })
-        ),
-      },
-    ],
-  },
-] as const;
-
 @customElement("hui-picture-card-editor")
 export class HuiPictureCardEditor
   extends LitElement
@@ -75,6 +36,63 @@ export class HuiPictureCardEditor
 
   @state() private _config?: PictureCardConfig;
 
+  private _schema = memoizeOne(
+    (localize: LocalizeFunc) =>
+      [
+        {
+          name: "image",
+          selector: {
+            media: {
+              accept: ["image/*"] as string[],
+              clearable: true,
+              image_upload: true,
+              hide_content_type: true,
+              content_id_helper: localize(
+                "ui.panel.lovelace.editor.card.picture.content_id_helper"
+              ),
+            },
+          },
+        },
+        {
+          name: "image_entity",
+          selector: { entity: { domain: ["image", "person"] } },
+        },
+        { name: "alt_text", selector: { text: {} } },
+        { name: "theme", selector: { theme: {} } },
+        {
+          name: "interactions",
+          type: "expandable",
+          flatten: true,
+          iconPath: mdiGestureTap,
+          schema: [
+            {
+              name: "tap_action",
+              selector: {
+                ui_action: {
+                  default_action: "more-info",
+                },
+              },
+            },
+            {
+              name: "",
+              type: "optional_actions",
+              flatten: true,
+              schema: (["hold_action", "double_tap_action"] as const).map(
+                (action) => ({
+                  name: action,
+                  selector: {
+                    ui_action: {
+                      default_action: "none" as const,
+                    },
+                  },
+                })
+              ),
+            },
+          ],
+        },
+      ] as const
+  );
+
   public setConfig(config: PictureCardConfig): void {
     assert(config, cardConfigStruct);
     this._config = config;
@@ -88,19 +106,28 @@ export class HuiPictureCardEditor
     return html`
       <ha-form
         .hass=${this.hass}
-        .data=${this._config}
-        .schema=${SCHEMA}
+        .data=${this._processData(this._config)}
+        .schema=${this._schema(this.hass.localize)}
         .computeLabel=${this._computeLabelCallback}
         @value-changed=${this._valueChanged}
       ></ha-form>
     `;
   }
 
+  private _processData = memoizeOne((config: PictureCardConfig) => ({
+    ...config,
+    ...(typeof config.image === "string"
+      ? { image: { media_content_id: config.image } }
+      : {}),
+  }));
+
   private _valueChanged(ev: CustomEvent): void {
     fireEvent(this, "config-changed", { config: ev.detail.value });
   }
 
-  private _computeLabelCallback = (schema: SchemaUnion<typeof SCHEMA>) => {
+  private _computeLabelCallback = (
+    schema: SchemaUnion<ReturnType<typeof this._schema>>
+  ) => {
     switch (schema.name) {
       case "theme":
         return `${this.hass!.localize(

src/panels/lovelace/editor/hui-element-editor.ts

@@ -4,8 +4,8 @@ import { property, query, state } from "lit/decorators";
 import { cache } from "lit/directives/cache";
 import type { HASSDomEvent } from "../../../common/dom/fire_event";
 import { fireEvent } from "../../../common/dom/fire_event";
-import { debounce } from "../../../common/util/debounce";
 import { handleStructError } from "../../../common/structs/handle-errors";
+import { debounce } from "../../../common/util/debounce";
 import { deepEqual } from "../../../common/util/deep-equal";
 import "../../../components/ha-alert";
 import "../../../components/ha-spinner";
@@ -57,8 +57,6 @@ export abstract class HuiElementEditor<
 
   @property({ attribute: false }) public context?: C;
 
-  @property({ attribute: false }) public schema?;
-
   @state() private _config?: T;
 
   @state() private _configElement?: LovelaceGenericElementEditor;
@@ -314,9 +312,6 @@ export abstract class HuiElementEditor<
     if (this._configElement && changedProperties.has("context")) {
       this._configElement.context = this.context;
     }
-    if (this._configElement && changedProperties.has("schema")) {
-      this._configElement.schema = this.schema;
-    }
   }
 
   private _handleUIConfigChanged(ev: UIConfigChangedEvent<T>) {
@@ -404,7 +399,6 @@ export abstract class HuiElementEditor<
         configElement.lovelace = this.lovelace;
       }
       configElement.context = this.context;
-      configElement.schema = this.schema;
       configElement.addEventListener("config-changed", (ev) =>
         this._handleUIConfigChanged(ev as UIConfigChangedEvent<T>)
       );

src/panels/lovelace/editor/hui-form-element-editor.ts

@@ -0,0 +1,19 @@
+import { customElement, property } from "lit/decorators";
+import type { HaFormSchema } from "../../../components/ha-form/types";
+import type { LovelaceConfigForm } from "../types";
+import { HuiElementEditor } from "./hui-element-editor";
+
+@customElement("hui-form-element-editor")
+export class HuiFormElementEditor extends HuiElementEditor {
+  @property({ attribute: false }) public schema!: HaFormSchema[];
+
+  protected async getConfigForm(): Promise<LovelaceConfigForm | undefined> {
+    return { schema: this.schema };
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "hui-form-element-editor": HuiFormElementEditor;
+  }
+}

src/panels/lovelace/editor/hui-sub-element-editor.ts

@@ -12,6 +12,7 @@ import "./feature-editor/hui-card-feature-element-editor";
 import "./header-footer-editor/hui-header-footer-element-editor";
 import "./heading-badge-editor/hui-heading-badge-element-editor";
 import type { HuiElementEditor } from "./hui-element-editor";
+import "./hui-form-element-editor";
 import "./picture-element-editor/hui-picture-element-element-editor";
 import type { GUIModeChangedEvent, SubElementEditorConfig } from "./types";
 
@@ -83,6 +84,18 @@ export class HuiSubElementEditor extends LitElement {
   private _renderEditor() {
     const type = this.config.type;
 
+    if (this.schema) {
+      return html`
+        <hui-form-element-editor
+          class="editor"
+          .hass=${this.hass}
+          .value=${this.config.elementConfig}
+          .schema=${this.schema}
+          .context=${this.config.context}
+          @config-changed=${this._handleConfigChanged}
+        ></hui-form-element-editor>
+      `;
+    }
     switch (type) {
       case "row":
         return html`
@@ -91,7 +104,6 @@ export class HuiSubElementEditor extends LitElement {
             .hass=${this.hass}
             .value=${this.config.elementConfig}
             .context=${this.config.context}
-            .schema=${this.schema}
             @config-changed=${this._handleConfigChanged}
             @GUImode-changed=${this._handleGUIModeChanged}
           ></hui-row-element-editor>

src/translations/en.json

@@ -2674,11 +2674,7 @@
             "addons_description": "Select what add-ons you want to include.",
             "addons_all": "All",
             "addons_none": "None",
-            "addons_custom": "Custom",
-            "estimated_size": "Estimated backup size: {uncompressed} ({compressed} compressed)",
-            "estimated_size_disclaimer": "This is an approximation based on current storage usage. The actual backup size will vary.",
-            "estimated_size_disclaimer_addons_custom": "This estimate includes all add-ons, and not individual add-on sizes.",
-            "estimated_size_loading": "Loading size estimate..."
+            "addons_custom": "Custom"
           },
           "data_picker": {
             "settings": "Settings",
@@ -7884,7 +7880,8 @@
             },
             "picture": {
               "name": "Picture",
-              "description": "The Picture card allows you to set an image to use for navigation to various paths in your interface or to perform an action."
+              "description": "The Picture card allows you to set an image to use for navigation to various paths in your interface or to perform an action.",
+              "content_id_helper": "Enter a media_source id or a URL for the image to be displayed."
             },
             "picture-elements": {
               "name": "Picture elements",
@@ -7939,7 +7936,7 @@
               "hide_completed": "Hide completed items",
               "hide_create": "Hide 'Add item' field",
               "hide_section_headers": "Hide section headers",
-              "hide_section_headers_helper": "Removes the 'Active' and 'Completed' sections with the overflow menus.",
+              "hide_section_headers_helper": "Removes the 'Active' and 'Completed' section headers and their overflow menus.",
               "display_order": "Display order",
               "item_tap_action": "Item tap behavior",
               "actions": {

yarn.lock

@@ -1284,15 +1284,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@codemirror/view@npm:6.38.4, @codemirror/view@npm:^6.0.0, @codemirror/view@npm:^6.17.0, @codemirror/view@npm:^6.23.0, @codemirror/view@npm:^6.27.0":
-  version: 6.38.4
-  resolution: "@codemirror/view@npm:6.38.4"
+"@codemirror/view@npm:6.38.5, @codemirror/view@npm:^6.0.0, @codemirror/view@npm:^6.17.0, @codemirror/view@npm:^6.23.0, @codemirror/view@npm:^6.27.0":
+  version: 6.38.5
+  resolution: "@codemirror/view@npm:6.38.5"
   dependencies:
     "@codemirror/state": "npm:^6.5.0"
     crelt: "npm:^1.0.6"
     style-mod: "npm:^4.1.0"
     w3c-keyname: "npm:^2.2.4"
-  checksum: 10/86b3894e9e7c2113aabb1db8684d0520378339c194fa56a688fc26cd7d40336bb9df1f5f19f68309d95f14b80ecf0b70c0ffe5e43f2ec11c4bab18f2d5ee4494
+  checksum: 10/2335b593770042eb3adfe369073432b07cd2d15f1e230ae4dc7be7a7b8edd74e57c13e59b92a11e7e5d59ae030aabf7f55478dfec1cf2a2fe3a1ef3f091676a4
   languageName: node
   linkType: hard
 
@@ -1942,9 +1942,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@home-assistant/webawesome@npm:3.0.0-beta.6.ha.1":
-  version: 3.0.0-beta.6.ha.1
-  resolution: "@home-assistant/webawesome@npm:3.0.0-beta.6.ha.1"
+"@home-assistant/webawesome@npm:3.0.0-beta.6.ha.4":
+  version: 3.0.0-beta.6.ha.4
+  resolution: "@home-assistant/webawesome@npm:3.0.0-beta.6.ha.4"
   dependencies:
     "@ctrl/tinycolor": "npm:4.1.0"
     "@floating-ui/dom": "npm:^1.6.13"
@@ -1955,7 +1955,7 @@ __metadata:
     lit: "npm:^3.2.1"
     nanoid: "npm:^5.1.5"
     qr-creator: "npm:^1.0.0"
-  checksum: 10/c9510e0c65b682c3868b5cbbf046f62aea30e3c5d969128d9032e0d89a8943faa4c9d78c3500446ec04cffeb0ab1939b870b60d454db657faed2aa0ac6026a3e
+  checksum: 10/d9072b321126ef458468ed2cf040e0b04cb2aff73336c6e742c0cfb25d9fb674b7672e7c9abcf5bcb0aa0b2fe953c20186f0910f485024c827bfe4cf399f10a4
   languageName: node
   linkType: hard
 
@@ -4945,106 +4945,106 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@typescript-eslint/eslint-plugin@npm:8.45.0":
-  version: 8.45.0
-  resolution: "@typescript-eslint/eslint-plugin@npm:8.45.0"
+"@typescript-eslint/eslint-plugin@npm:8.46.0":
+  version: 8.46.0
+  resolution: "@typescript-eslint/eslint-plugin@npm:8.46.0"
   dependencies:
     "@eslint-community/regexpp": "npm:^4.10.0"
-    "@typescript-eslint/scope-manager": "npm:8.45.0"
-    "@typescript-eslint/type-utils": "npm:8.45.0"
-    "@typescript-eslint/utils": "npm:8.45.0"
-    "@typescript-eslint/visitor-keys": "npm:8.45.0"
+    "@typescript-eslint/scope-manager": "npm:8.46.0"
+    "@typescript-eslint/type-utils": "npm:8.46.0"
+    "@typescript-eslint/utils": "npm:8.46.0"
+    "@typescript-eslint/visitor-keys": "npm:8.46.0"
     graphemer: "npm:^1.4.0"
     ignore: "npm:^7.0.0"
     natural-compare: "npm:^1.4.0"
     ts-api-utils: "npm:^2.1.0"
   peerDependencies:
-    "@typescript-eslint/parser": ^8.45.0
+    "@typescript-eslint/parser": ^8.46.0
     eslint: ^8.57.0 || ^9.0.0
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/6d31dbd3354028b4a010af0ea2614a171b11616e6f20d36d74529b8888681ae8d15e1269122b8a8d5fae117bdd66dac4a38cfc99dc2a0ee33bd22c10075f63e4
+  checksum: 10/415afd894a5fec9cfe2c327c8b26377045979cc6bdf720aeecb32af335b9e6865c70fa6a355dd16f52a36dc38f50755df3eb1466d5822c53c80465ff824c9881
   languageName: node
   linkType: hard
 
-"@typescript-eslint/parser@npm:8.45.0":
-  version: 8.45.0
-  resolution: "@typescript-eslint/parser@npm:8.45.0"
+"@typescript-eslint/parser@npm:8.46.0":
+  version: 8.46.0
+  resolution: "@typescript-eslint/parser@npm:8.46.0"
   dependencies:
-    "@typescript-eslint/scope-manager": "npm:8.45.0"
-    "@typescript-eslint/types": "npm:8.45.0"
-    "@typescript-eslint/typescript-estree": "npm:8.45.0"
-    "@typescript-eslint/visitor-keys": "npm:8.45.0"
+    "@typescript-eslint/scope-manager": "npm:8.46.0"
+    "@typescript-eslint/types": "npm:8.46.0"
+    "@typescript-eslint/typescript-estree": "npm:8.46.0"
+    "@typescript-eslint/visitor-keys": "npm:8.46.0"
     debug: "npm:^4.3.4"
   peerDependencies:
     eslint: ^8.57.0 || ^9.0.0
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/4f8b7c73ae3b53c2adc4e981ac2ca90839a118947635481b45d29423d39b7b73cde2b185ad1084c9e19c3239444bf1be81f40b861176eec4540cb46848731991
+  checksum: 10/6838fde776fd2b2932b259a20cc89b517e0c94a2cfa363a5e8531095c23fb35d8f803196f6594026d0510bf2a8ec003c67181bb2c407904685a64c97602da65f
   languageName: node
   linkType: hard
 
-"@typescript-eslint/project-service@npm:8.45.0":
-  version: 8.45.0
-  resolution: "@typescript-eslint/project-service@npm:8.45.0"
+"@typescript-eslint/project-service@npm:8.46.0":
+  version: 8.46.0
+  resolution: "@typescript-eslint/project-service@npm:8.46.0"
   dependencies:
-    "@typescript-eslint/tsconfig-utils": "npm:^8.45.0"
-    "@typescript-eslint/types": "npm:^8.45.0"
+    "@typescript-eslint/tsconfig-utils": "npm:^8.46.0"
+    "@typescript-eslint/types": "npm:^8.46.0"
     debug: "npm:^4.3.4"
   peerDependencies:
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/919c8260dae79eaec79de84a5ae66fbb09c2ab7aca8c3b7785cb011582a2864c8091e64c84013b05bce812e522fbc4a5ae1c68f86404e078fc84da0fe80247ce
+  checksum: 10/de11af23ae6b82769b667e8d6e81d47ce039c7817465b99c1e29c8fbcac58af898bebe70368a274cd7b3c7232354134d53ceba0415b8d7e18317037bc4a4a2f7
   languageName: node
   linkType: hard
 
-"@typescript-eslint/scope-manager@npm:8.45.0":
-  version: 8.45.0
-  resolution: "@typescript-eslint/scope-manager@npm:8.45.0"
+"@typescript-eslint/scope-manager@npm:8.46.0":
+  version: 8.46.0
+  resolution: "@typescript-eslint/scope-manager@npm:8.46.0"
   dependencies:
-    "@typescript-eslint/types": "npm:8.45.0"
-    "@typescript-eslint/visitor-keys": "npm:8.45.0"
-  checksum: 10/e45d63a0109eca00f6b431d87e73eacfa03b1795905f123e9144bcacb5abb83888167d1849317c6f90ba1f3553196b2eab13e5e7cdd1050d7a84eaadb65ba801
+    "@typescript-eslint/types": "npm:8.46.0"
+    "@typescript-eslint/visitor-keys": "npm:8.46.0"
+  checksum: 10/ed85abd08c0edf088b1b11757c658acf593cf84051bddde651304a609d3a6cd9e331149e88653676606a565c3f92c191d4af049f540f6e3bb692a4f38305fd71
   languageName: node
   linkType: hard
 
-"@typescript-eslint/tsconfig-utils@npm:8.45.0, @typescript-eslint/tsconfig-utils@npm:^8.45.0":
-  version: 8.45.0
-  resolution: "@typescript-eslint/tsconfig-utils@npm:8.45.0"
+"@typescript-eslint/tsconfig-utils@npm:8.46.0, @typescript-eslint/tsconfig-utils@npm:^8.46.0":
+  version: 8.46.0
+  resolution: "@typescript-eslint/tsconfig-utils@npm:8.46.0"
   peerDependencies:
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/91696bbc34758749d3647236986bf418bacdc0de0e27c2d39cd7c2408c404c35ed18c47c2a55aea0bb9525cc7eb656586359c4e651144603f3438ce93fe80081
+  checksum: 10/e78a66a854322423aca835070c5ee9489975c4d80d2f8ffe9cf4d6e3f67a1646ddc05b086f7156599c90ad521670ca572a4315f2b49a5922c33d6e49723558e4
   languageName: node
   linkType: hard
 
-"@typescript-eslint/type-utils@npm:8.45.0":
-  version: 8.45.0
-  resolution: "@typescript-eslint/type-utils@npm:8.45.0"
+"@typescript-eslint/type-utils@npm:8.46.0":
+  version: 8.46.0
+  resolution: "@typescript-eslint/type-utils@npm:8.46.0"
   dependencies:
-    "@typescript-eslint/types": "npm:8.45.0"
-    "@typescript-eslint/typescript-estree": "npm:8.45.0"
-    "@typescript-eslint/utils": "npm:8.45.0"
+    "@typescript-eslint/types": "npm:8.46.0"
+    "@typescript-eslint/typescript-estree": "npm:8.46.0"
+    "@typescript-eslint/utils": "npm:8.46.0"
     debug: "npm:^4.3.4"
     ts-api-utils: "npm:^2.1.0"
   peerDependencies:
     eslint: ^8.57.0 || ^9.0.0
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/81017b3f4780a65a4e4268ab208f1cb8891c1ced9ade23d8eb4575b18aeb99fe59a0d0ddbb4eea9c086567a1b4515d3466e850d4c81ec0d2d88658c43877a6cf
+  checksum: 10/5405b71b91d02ed4eac1028fc156c053953403b9f48393d92340b15a8b05bee5bf1281324c6283ac31a0e03cc1a19baf94768cb3fd70b4621f8c07a4243837db
   languageName: node
   linkType: hard
 
-"@typescript-eslint/types@npm:8.45.0, @typescript-eslint/types@npm:^8.45.0":
-  version: 8.45.0
-  resolution: "@typescript-eslint/types@npm:8.45.0"
-  checksum: 10/889ded2b9bf376c876611b2a37f89051fdc8ec501314a4b97832caefa4305bffc4b752548941ce2e7f9659a81336d096d439d4c2ed236c99fefdf60b715593dd
+"@typescript-eslint/types@npm:8.46.0, @typescript-eslint/types@npm:^8.46.0":
+  version: 8.46.0
+  resolution: "@typescript-eslint/types@npm:8.46.0"
+  checksum: 10/0118b0dd592bf4beaf41e8c6be812980dd0adea44d48c90d8b0272777b58d4cfd6326b8bc363efa3c640be476a6bf3632aee2d97052d5e34071e6576b9c28264
   languageName: node
   linkType: hard
 
-"@typescript-eslint/typescript-estree@npm:8.45.0":
-  version: 8.45.0
-  resolution: "@typescript-eslint/typescript-estree@npm:8.45.0"
+"@typescript-eslint/typescript-estree@npm:8.46.0":
+  version: 8.46.0
+  resolution: "@typescript-eslint/typescript-estree@npm:8.46.0"
   dependencies:
-    "@typescript-eslint/project-service": "npm:8.45.0"
-    "@typescript-eslint/tsconfig-utils": "npm:8.45.0"
-    "@typescript-eslint/types": "npm:8.45.0"
-    "@typescript-eslint/visitor-keys": "npm:8.45.0"
+    "@typescript-eslint/project-service": "npm:8.46.0"
+    "@typescript-eslint/tsconfig-utils": "npm:8.46.0"
+    "@typescript-eslint/types": "npm:8.46.0"
+    "@typescript-eslint/visitor-keys": "npm:8.46.0"
     debug: "npm:^4.3.4"
     fast-glob: "npm:^3.3.2"
     is-glob: "npm:^4.0.3"
@@ -5053,32 +5053,32 @@ __metadata:
     ts-api-utils: "npm:^2.1.0"
   peerDependencies:
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/2fb4e63ad6128afbada8eabaabfe7d5a8f1a1f387bb13d7d3209103493ba974b518bf47b17e9a853beba10ec81efd5582ebf628c2eb77a924cf67d4d85466e5e
+  checksum: 10/61053bd0c35a1fe5c82aef00cb70dbe0878ab28e55550cc1e2d6e7d4a0520c81947eb7505227c85a742a93db905d7e7376aed7d958dc257507b9bdda1daf0b00
   languageName: node
   linkType: hard
 
-"@typescript-eslint/utils@npm:8.45.0":
-  version: 8.45.0
-  resolution: "@typescript-eslint/utils@npm:8.45.0"
+"@typescript-eslint/utils@npm:8.46.0":
+  version: 8.46.0
+  resolution: "@typescript-eslint/utils@npm:8.46.0"
   dependencies:
     "@eslint-community/eslint-utils": "npm:^4.7.0"
-    "@typescript-eslint/scope-manager": "npm:8.45.0"
-    "@typescript-eslint/types": "npm:8.45.0"
-    "@typescript-eslint/typescript-estree": "npm:8.45.0"
+    "@typescript-eslint/scope-manager": "npm:8.46.0"
+    "@typescript-eslint/types": "npm:8.46.0"
+    "@typescript-eslint/typescript-estree": "npm:8.46.0"
   peerDependencies:
     eslint: ^8.57.0 || ^9.0.0
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/9e675a0da4434bd434901f9ba3e1e91d4d7ad542d7fcf8c23534a67f2f9039a569da20929e67a6562e3a263be226ad424cd0c1ac80f7828f4285f7f34e361926
+  checksum: 10/4e0da60de389799afdd36249fd4bcf9e085a4d6f119e241e436a701b45cdf10becc3f1e3cdef29ebbf147a81f40d9a4800d428cb4a66799d3e4aa80b879c9ee2
   languageName: node
   linkType: hard
 
-"@typescript-eslint/visitor-keys@npm:8.45.0":
-  version: 8.45.0
-  resolution: "@typescript-eslint/visitor-keys@npm:8.45.0"
+"@typescript-eslint/visitor-keys@npm:8.46.0":
+  version: 8.46.0
+  resolution: "@typescript-eslint/visitor-keys@npm:8.46.0"
   dependencies:
-    "@typescript-eslint/types": "npm:8.45.0"
+    "@typescript-eslint/types": "npm:8.46.0"
     eslint-visitor-keys: "npm:^4.2.1"
-  checksum: 10/8ae7e19c69c1f67fa8f952c18a09ad42a8cba492545d6e1dca6750e760893773f69ec6b1a96d0997e833c82aecc5ff7fb9546c5abd6c4427d91206670cf8ff37
+  checksum: 10/37e6145b6a5e960c59777d7fc86f722ff696e76c627106ac4577b945ca35744a5f96525d77bde50fe8c328503e9392e21e3adb7cf9899ae0efc054d63f4c3916
   languageName: node
   linkType: hard
 
@@ -9189,7 +9189,7 @@ __metadata:
     "@codemirror/legacy-modes": "npm:6.5.2"
     "@codemirror/search": "npm:6.5.11"
     "@codemirror/state": "npm:6.5.2"
-    "@codemirror/view": "npm:6.38.4"
+    "@codemirror/view": "npm:6.38.5"
     "@date-fns/tz": "npm:1.4.1"
     "@egjs/hammerjs": "npm:2.0.17"
     "@formatjs/intl-datetimeformat": "npm:6.18.1"
@@ -9207,7 +9207,7 @@ __metadata:
     "@fullcalendar/list": "npm:6.1.19"
     "@fullcalendar/luxon3": "npm:6.1.19"
     "@fullcalendar/timegrid": "npm:6.1.19"
-    "@home-assistant/webawesome": "npm:3.0.0-beta.6.ha.1"
+    "@home-assistant/webawesome": "npm:3.0.0-beta.6.ha.4"
     "@lezer/highlight": "npm:1.2.1"
     "@lit-labs/motion": "npm:1.0.9"
     "@lit-labs/observers": "npm:2.0.6"
@@ -9332,7 +9332,7 @@ __metadata:
     lodash.template: "npm:4.5.0"
     luxon: "npm:3.7.2"
     map-stream: "npm:0.0.7"
-    marked: "npm:16.3.0"
+    marked: "npm:16.4.0"
     memoize-one: "npm:6.0.0"
     node-vibrant: "npm:4.0.3"
     object-hash: "npm:3.0.0"
@@ -9354,7 +9354,7 @@ __metadata:
     tinykeys: "npm:3.0.0"
     ts-lit-plugin: "npm:2.0.2"
     typescript: "npm:5.9.3"
-    typescript-eslint: "npm:8.45.0"
+    typescript-eslint: "npm:8.46.0"
     ua-parser-js: "npm:2.0.5"
     vite-tsconfig-paths: "npm:5.1.4"
     vitest: "npm:3.2.4"
@@ -10974,12 +10974,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"marked@npm:16.3.0":
-  version: 16.3.0
-  resolution: "marked@npm:16.3.0"
+"marked@npm:16.4.0":
+  version: 16.4.0
+  resolution: "marked@npm:16.4.0"
   bin:
     marked: bin/marked.js
-  checksum: 10/60497834b9acfb3b3994222509d359ecb9a197c885dfeb77e2050a287cd2f4ab19f00d5597172b47f9e0c54d9e1e13d8b2dd73322b7838599e1f16d1d6283f5b
+  checksum: 10/5174b345ccc61e2030c2eb8abb3e5cbebeb6697a6d2b609f64ffa2ff6e482f5f1e1fda1912db19c747f43971b1fa54ae53c1ab1ce5d2f58566d6db4bc3016833
   languageName: node
   linkType: hard
 
@@ -14317,18 +14317,18 @@ __metadata:
   languageName: node
   linkType: hard
 
-"typescript-eslint@npm:8.45.0":
-  version: 8.45.0
-  resolution: "typescript-eslint@npm:8.45.0"
+"typescript-eslint@npm:8.46.0":
+  version: 8.46.0
+  resolution: "typescript-eslint@npm:8.46.0"
   dependencies:
-    "@typescript-eslint/eslint-plugin": "npm:8.45.0"
-    "@typescript-eslint/parser": "npm:8.45.0"
-    "@typescript-eslint/typescript-estree": "npm:8.45.0"
-    "@typescript-eslint/utils": "npm:8.45.0"
+    "@typescript-eslint/eslint-plugin": "npm:8.46.0"
+    "@typescript-eslint/parser": "npm:8.46.0"
+    "@typescript-eslint/typescript-estree": "npm:8.46.0"
+    "@typescript-eslint/utils": "npm:8.46.0"
   peerDependencies:
     eslint: ^8.57.0 || ^9.0.0
     typescript: ">=4.8.4 <6.0.0"
-  checksum: 10/1c17ebb5bcbea418c8f372d71b5c2df8c9b8c6897d1bda8196ea17bac8fabeffe1814bc4f7a28d40f404fb811c97fcda0d69c4375b4f010d9bf44d19d8401706
+  checksum: 10/fd74aab1d21d661299a64107236b5c3515d6d955eb1764b56c5c9505b8cef5f2600e8290d251f1379138333573df94a1fe1fd7fef23952b5ab9f12ff2b774f92
   languageName: node
   linkType: hard