From e45709fffc34e4c486d1500a82a58bf86dcc35fb Mon Sep 17 00:00:00 2001
From: karwosts <32912880+karwosts@users.noreply.github.com>
Date: Tue, 30 Jan 2024 17:57:35 -0500
Subject: [PATCH] Fix map icon color (#19567)

* Fix map icon color

* different solution

* updates from code review
---
 src/components/map/ha-locations-editor.ts | 2 +-
 src/components/map/ha-map.ts              | 8 ++++----
 src/panels/lovelace/cards/hui-map-card.ts | 2 +-
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/map/ha-locations-editor.ts b/src/components/map/ha-locations-editor.ts
index 10702cbf55..e0f1c1d8f3 100644
--- a/src/components/map/ha-locations-editor.ts
+++ b/src/components/map/ha-locations-editor.ts
@@ -133,7 +133,7 @@ export class HaLocationsEditor extends LitElement {
         .layers=${this._getLayers(this._circles, this._locationMarkers)}
         .zoom=${this.zoom}
         .autoFit=${this.autoFit}
-        .darkMode=${this.darkMode}
+        ?darkMode=${this.darkMode}
       ></ha-map>
       ${this.helper
         ? html`<ha-input-helper-text>${this.helper}</ha-input-helper-text>`
diff --git a/src/components/map/ha-map.ts b/src/components/map/ha-map.ts
index e9abacec5b..42834dbe69 100644
--- a/src/components/map/ha-map.ts
+++ b/src/components/map/ha-map.ts
@@ -156,9 +156,9 @@ export class HaMap extends ReactiveElement {
   }
 
   private _updateMapStyle(): void {
-    const darkMode = this.darkMode ?? this.hass.themes.darkMode ?? false;
-    const forcedDark = this.darkMode ?? false;
-    const map = this.shadowRoot!.getElementById("map");
+    const darkMode = this.darkMode || (this.hass.themes.darkMode ?? false);
+    const forcedDark = this.darkMode;
+    const map = this.renderRoot.querySelector("#map");
     map!.classList.toggle("dark", darkMode);
     map!.classList.toggle("forced-dark", forcedDark);
   }
@@ -361,7 +361,7 @@ export class HaMap extends ReactiveElement {
     );
 
     const className =
-      this.darkMode ?? this.hass.themes.darkMode ? "dark" : "light";
+      this.darkMode || this.hass.themes.darkMode ? "dark" : "light";
 
     for (const entity of this.entities) {
       const stateObj = hass.states[getEntityId(entity)];
diff --git a/src/panels/lovelace/cards/hui-map-card.ts b/src/panels/lovelace/cards/hui-map-card.ts
index c3076985f4..f5ea4f1a10 100644
--- a/src/panels/lovelace/cards/hui-map-card.ts
+++ b/src/panels/lovelace/cards/hui-map-card.ts
@@ -166,7 +166,7 @@ class HuiMapCard extends LitElement implements LovelaceCard {
             .paths=${this._getHistoryPaths(this._config, this._stateHistory)}
             .autoFit=${this._config.auto_fit || false}
             .fitZones=${this._config.fit_zones}
-            .darkMode=${this._config.dark_mode}
+            ?darkMode=${this._config.dark_mode}
             interactiveZones
             renderPassive
           ></ha-map>