add nav icons

Bumps [github/codeql-action](https://github.com/github/codeql-action) from 4.31.8 to 4.31.9.
- [Release notes](https://github.com/github/codeql-action/releases)
- [Changelog](https://github.com/github/codeql-action/blob/main/CHANGELOG.md)
- [Commits](1b168cd394...5d4e8d1aca)

---
updated-dependencies:
- dependency-name: github/codeql-action
  dependency-version: 4.31.9
  dependency-type: direct:production
  update-type: version-update:semver-patch
...

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>

.github/workflows/codeql-analysis.yml

@@ -36,14 +36,14 @@ jobs:
 
       # Initializes the CodeQL tools for scanning.
       - name: Initialize CodeQL
-        uses: github/codeql-action/init@1b168cd39490f61582a9beae412bb7057a6b2c4e # v4.31.8
+        uses: github/codeql-action/init@5d4e8d1aca955e8d8589aabd499c5cae939e33c7 # v4.31.9
         with:
           languages: ${{ matrix.language }}
 
       # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
       # If this step fails, then you should remove it and run the build manually (see below)
       - name: Autobuild
-        uses: github/codeql-action/autobuild@1b168cd39490f61582a9beae412bb7057a6b2c4e # v4.31.8
+        uses: github/codeql-action/autobuild@5d4e8d1aca955e8d8589aabd499c5cae939e33c7 # v4.31.9
 
       # ℹ️ Command-line programs to run using the OS shell.
       # 📚 https://git.io/JvXDl
@@ -57,4 +57,4 @@ jobs:
       #   make release
 
       - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@1b168cd39490f61582a9beae412bb7057a6b2c4e # v4.31.8
+        uses: github/codeql-action/analyze@5d4e8d1aca955e8d8589aabd499c5cae939e33c7 # v4.31.9

src/common/color/compute-color.ts

@@ -1,6 +1,7 @@
 export const THEME_COLORS = new Set([
   "primary",
   "accent",
+  "disabled",
   "red",
   "pink",
   "purple",
@@ -24,9 +25,6 @@ export const THEME_COLORS = new Set([
   "blue-grey",
   "black",
   "white",
-  "primary-text",
-  "secondary-text",
-  "disabled",
 ]);
 
 export function computeCssColor(color: string): string {

src/components/ha-adaptive-dialog.ts

@@ -1,8 +1,8 @@
 import { mdiClose } from "@mdi/js";
 import { css, html, LitElement } from "lit";
 import { customElement, property, state } from "lit/decorators";
-import type { HomeAssistant } from "../types";
 import { listenMediaQuery } from "../common/dom/media_query";
+import type { HomeAssistant } from "../types";
 import "./ha-bottom-sheet";
 import "./ha-dialog-header";
 import "./ha-icon-button";
@@ -118,27 +118,29 @@ export class HaAdaptiveDialog extends LitElement {
     if (this._mode === "bottom-sheet") {
       return html`
         <ha-bottom-sheet .open=${this.open} flexcontent>
-          <ha-dialog-header
-            slot="header"
-            .subtitlePosition=${this.headerSubtitlePosition}
-          >
-            <slot name="headerNavigationIcon" slot="navigationIcon">
-              <ha-icon-button
-                data-drawer="close"
-                .label=${this.hass?.localize("ui.common.close") ?? "Close"}
-                .path=${mdiClose}
-              ></ha-icon-button>
-            </slot>
-            ${this.headerTitle !== undefined
-              ? html`<span slot="title" class="title" id="ha-wa-dialog-title">
-                  ${this.headerTitle}
-                </span>`
-              : html`<slot name="headerTitle" slot="title"></slot>`}
-            ${this.headerSubtitle !== undefined
-              ? html`<span slot="subtitle">${this.headerSubtitle}</span>`
-              : html`<slot name="headerSubtitle" slot="subtitle"></slot>`}
-            <slot name="headerActionItems" slot="actionItems"></slot>
-          </ha-dialog-header>
+          <slot name="header" slot="header">
+            <ha-dialog-header
+              slot="header"
+              .subtitlePosition=${this.headerSubtitlePosition}
+            >
+              <slot name="headerNavigationIcon" slot="navigationIcon">
+                <ha-icon-button
+                  data-drawer="close"
+                  .label=${this.hass?.localize("ui.common.close") ?? "Close"}
+                  .path=${mdiClose}
+                ></ha-icon-button>
+              </slot>
+              ${this.headerTitle !== undefined
+                ? html`<span slot="title" class="title" id="ha-wa-dialog-title">
+                    ${this.headerTitle}
+                  </span>`
+                : html`<slot name="headerTitle" slot="title"></slot>`}
+              ${this.headerSubtitle !== undefined
+                ? html`<span slot="subtitle">${this.headerSubtitle}</span>`
+                : html`<slot name="headerSubtitle" slot="subtitle"></slot>`}
+              <slot name="headerActionItems" slot="actionItems"></slot>
+            </ha-dialog-header>
+          </slot>
           <slot></slot>
           <slot name="footer" slot="footer"></slot>
         </ha-bottom-sheet>
@@ -157,16 +159,18 @@ export class HaAdaptiveDialog extends LitElement {
         .headerSubtitlePosition=${this.headerSubtitlePosition}
         flexcontent
       >
-        <slot name="headerNavigationIcon" slot="headerNavigationIcon">
-          <ha-icon-button
-            data-dialog="close"
-            .label=${this.hass.localize("ui.common.close")}
-            .path=${mdiClose}
-          ></ha-icon-button>
+        <slot name="header" slot="header">
+          <slot name="headerNavigationIcon" slot="headerNavigationIcon">
+            <ha-icon-button
+              data-dialog="close"
+              .label=${this.hass.localize("ui.common.close")}
+              .path=${mdiClose}
+            ></ha-icon-button>
+          </slot>
+          <slot name="headerTitle" slot="headerTitle"></slot>
+          <slot name="headerSubtitle" slot="headerSubtitle"></slot>
+          <slot name="headerActionItems" slot="headerActionItems"></slot>
         </slot>
-        <slot name="headerTitle" slot="headerTitle"></slot>
-        <slot name="headerSubtitle" slot="headerSubtitle"></slot>
-        <slot name="headerActionItems" slot="headerActionItems"></slot>
         <slot></slot>
         <slot name="footer" slot="footer"></slot>
       </ha-wa-dialog>

src/components/ha-color-picker.ts

@@ -1,8 +1,7 @@
 import { mdiInvertColorsOff, mdiPalette } from "@mdi/js";
-import { html, LitElement, nothing } from "lit";
+import { html, LitElement } from "lit";
 import { customElement, property } from "lit/decorators";
 import { styleMap } from "lit/directives/style-map";
-import memoizeOne from "memoize-one";
 import { computeCssColor, THEME_COLORS } from "../common/color/compute-color";
 import { fireEvent } from "../common/dom/fire_event";
 import type { LocalizeKeys } from "../common/translations/localize";
@@ -50,40 +49,11 @@ export class HaColorPicker extends LitElement {
         .rowRenderer=${this._rowRenderer}
         .valueRenderer=${this._valueRenderer}
         @value-changed=${this._valueChanged}
-        .notFoundLabel=${this.hass.localize(
-          "ui.components.color-picker.no_colors_found"
-        )}
-        .getAdditionalItems=${this._getAdditionalItems}
       >
       </ha-generic-picker>
     `;
   }
 
-  private _getAdditionalItems = (
-    searchString?: string
-  ): PickerComboBoxItem[] => {
-    if (!searchString || searchString.trim() === "") {
-      return [];
-    }
-    const colors = this._getColors(
-      this.includeNone,
-      this.includeState,
-      this.defaultColor,
-      this.value
-    );
-    const exactMatch = colors.find((color) => color.id === searchString);
-    if (exactMatch) {
-      return [];
-    }
-    return [
-      {
-        id: searchString,
-        primary: this.hass.localize("ui.components.color-picker.custom_color"),
-        secondary: searchString,
-      },
-    ];
-  };
-
   private _getItems = () =>
     this._getColors(
       this.includeNone,
@@ -92,71 +62,72 @@ export class HaColorPicker extends LitElement {
       this.value
     );
 
-  private _getColors = memoizeOne(
-    (
-      includeNone: boolean,
-      includeState: boolean,
-      defaultColor: string | undefined,
-      currentValue: string | undefined
-    ): PickerComboBoxItem[] => {
-      const items: PickerComboBoxItem[] = [];
+  private _getColors = (
+    includeNone: boolean,
+    includeState: boolean,
+    defaultColor: string | undefined,
+    currentValue: string | undefined
+  ): PickerComboBoxItem[] => {
+    const items: PickerComboBoxItem[] = [];
 
-      const defaultSuffix = this.hass.localize(
-        "ui.components.color-picker.default"
-      );
+    const defaultSuffix = this.hass.localize(
+      "ui.components.color-picker.default"
+    );
 
-      const addDefaultSuffix = (label: string, isDefault: boolean) =>
-        isDefault && defaultSuffix ? `${label} (${defaultSuffix})` : label;
+    const addDefaultSuffix = (label: string, isDefault: boolean) =>
+      isDefault && defaultSuffix ? `${label} (${defaultSuffix})` : label;
 
-      if (includeNone) {
-        const noneLabel =
-          this.hass.localize("ui.components.color-picker.none") || "None";
-        items.push({
-          id: "none",
-          primary: addDefaultSuffix(noneLabel, defaultColor === "none"),
-          icon_path: mdiInvertColorsOff,
-        });
-      }
-
-      if (includeState) {
-        const stateLabel =
-          this.hass.localize("ui.components.color-picker.state") || "State";
-        items.push({
-          id: "state",
-          primary: addDefaultSuffix(stateLabel, defaultColor === "state"),
-          icon_path: mdiPalette,
-        });
-      }
-
-      Array.from(THEME_COLORS).forEach((color) => {
-        const themeLabel =
-          this.hass.localize(
-            `ui.components.color-picker.colors.${color}` as LocalizeKeys
-          ) || color;
-        items.push({
-          id: color,
-          primary: addDefaultSuffix(themeLabel, defaultColor === color),
-        });
+    if (includeNone) {
+      const noneLabel =
+        this.hass.localize("ui.components.color-picker.none") || "None";
+      items.push({
+        id: "none",
+        primary: addDefaultSuffix(noneLabel, defaultColor === "none"),
+        icon_path: mdiInvertColorsOff,
+        sorting_label: noneLabel,
       });
-
-      const isSpecial =
-        currentValue === "none" ||
-        currentValue === "state" ||
-        THEME_COLORS.has(currentValue || "");
-
-      const hasValue = currentValue && currentValue.length > 0;
-
-      if (hasValue && !isSpecial) {
-        items.push({
-          id: currentValue!,
-          primary: currentValue!,
-          sorting_label: currentValue!,
-        });
-      }
-
-      return items;
     }
-  );
+
+    if (includeState) {
+      const stateLabel =
+        this.hass.localize("ui.components.color-picker.state") || "State";
+      items.push({
+        id: "state",
+        primary: addDefaultSuffix(stateLabel, defaultColor === "state"),
+        icon_path: mdiPalette,
+        sorting_label: stateLabel,
+      });
+    }
+
+    Array.from(THEME_COLORS).forEach((color) => {
+      const themeLabel =
+        this.hass.localize(
+          `ui.components.color-picker.colors.${color}` as LocalizeKeys
+        ) || color;
+      items.push({
+        id: color,
+        primary: addDefaultSuffix(themeLabel, defaultColor === color),
+        sorting_label: themeLabel,
+      });
+    });
+
+    const isSpecial =
+      currentValue === "none" ||
+      currentValue === "state" ||
+      THEME_COLORS.has(currentValue || "");
+
+    const hasValue = currentValue && currentValue.length > 0;
+
+    if (hasValue && !isSpecial) {
+      items.push({
+        id: currentValue!,
+        primary: currentValue!,
+        sorting_label: currentValue!,
+      });
+    }
+
+    return items;
+  };
 
   private _rowRenderer: (
     item: PickerComboBoxItem,
@@ -174,9 +145,6 @@ export class HaColorPicker extends LitElement {
               ${this._renderColorCircle(item.id)}
             </span>`}
       <span slot="headline">${item.primary}</span>
-      ${item.secondary
-        ? html`<span slot="supporting-text">${item.secondary}</span>`
-        : nothing}
     </ha-combo-box-item>
   `;
 

src/components/ha-picker-combo-box.ts

@@ -436,7 +436,7 @@ export class HaPickerComboBox extends ScrollableFadeMixin(LitElement) {
         filteredItems.push(NO_ITEMS_AVAILABLE_ID);
       }
 
-      const additionalItems = this._getAdditionalItems(searchString);
+      const additionalItems = this._getAdditionalItems();
       filteredItems.push(...additionalItems);
 
       if (this.searchFn) {

src/panels/lovelace/cards/hui-history-graph-card.ts

@@ -268,6 +268,7 @@ export class HuiHistoryGraphCard extends LitElement implements LovelaceCard {
     now.setHours(now.getHours() - this._hoursToShow);
     const configUrl = `/history?${createSearchParam({
       entity_id: this._entityIds.join(","),
+      back: "1",
       start_date: now.toISOString(),
     })}`;
 

src/translations/en.json

@@ -921,13 +921,9 @@
         "default": "default",
         "state": "State color",
         "none": "No color",
-        "custom_color": "Custom color",
-        "no_colors_found": "No matching colors found",
         "colors": {
           "primary": "Primary",
           "accent": "Accent",
-          "primary-text": "Main text",
-          "secondary-text": "Secondary text",
           "disabled": "Disabled",
           "inactive": "Inactive",
           "red": "Red",
@@ -1338,6 +1334,7 @@
         "text": "Home Assistant is running in safe mode, custom integrations and frontend modules are not available. Restart Home Assistant to exit safe mode."
       },
       "quick-bar": {
+        "commands_title": "Commands",
         "commands": {
           "reload": {
             "all": "[%key:ui::panel::developer-tools::tabs::yaml::section::reloading::all%]",