bump @lit-labs/context, fix bug in button card + optimise (#15968)

package.json

@@ -45,7 +45,7 @@
     "@fullcalendar/list": "6.1.5",
     "@fullcalendar/timegrid": "6.1.5",
     "@lezer/highlight": "1.1.4",
-    "@lit-labs/context": "0.2.0",
+    "@lit-labs/context": "0.3.0",
     "@lit-labs/motion": "1.0.3",
     "@lit-labs/virtualizer": "1.0.1",
     "@lrnwebcomponents/simple-tooltip": "4.1.0",

src/common/dom/apply_themes_on_element.ts

@@ -93,7 +93,7 @@ export const applyThemesOnElement = (
     }
 
     // Nothing was changed
-    if (element._themes?.cacheKey === cacheKey) {
+    if (element.__themes?.cacheKey === cacheKey) {
       return;
     }
   }
@@ -119,7 +119,7 @@ export const applyThemesOnElement = (
     }
   }
 
-  if (!element._themes?.keys && !Object.keys(themeRules).length) {
+  if (!element.__themes?.keys && !Object.keys(themeRules).length) {
     // No styles to reset, and no styles to set
     return;
   }
@@ -130,8 +130,8 @@ export const applyThemesOnElement = (
       : undefined;
 
   // Add previous set keys to reset them, and new theme
-  const styles = { ...element._themes?.keys, ...newTheme?.styles };
+  const styles = { ...element.__themes?.keys, ...newTheme?.styles };
-  element._themes = { cacheKey, keys: newTheme?.keys };
+  element.__themes = { cacheKey, keys: newTheme?.keys };
 
   // Set and/or reset styles
   if (element.updateStyles) {

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

@@ -232,7 +232,10 @@ export class HuiButtonCard extends LitElement implements LovelaceCard {
 
   protected updated(changedProps: PropertyValues): void {
     super.updated(changedProps);
-    if (!this._config) {
+    if (!this._config || !this._themes) {
+      return;
+    }
+    if (!changedProps.has("_themes") && !changedProps.has("_config")) {
       return;
     }
     const oldThemes = changedProps.get("_themes") as
@@ -243,10 +246,10 @@ export class HuiButtonCard extends LitElement implements LovelaceCard {
       | undefined;
 
     if (
-      !oldThemes ||
+      (changedProps.has("_themes") &&
-      !oldConfig ||
+        (!oldThemes || oldThemes !== this._themes)) ||
-      oldThemes !== this._themes ||
+      (changedProps.has("_config") &&
-      oldConfig.theme !== this._config.theme
+        (!oldConfig || oldConfig.theme !== this._config.theme))
     ) {
       applyThemesOnElement(this, this._themes, this._config.theme);
     }

src/state/context-mixin.ts

@@ -24,66 +24,62 @@ export const contextMixin = <T extends Constructor<HassBaseEl>>(
       string,
       ContextProvider<any> | undefined
     > = {
-      states: new ContextProvider(
+      states: new ContextProvider(this, {
-        this,
+        context: statesContext,
-        statesContext,
+        initialValue: this.hass ? this.hass.states : this._pendingHass.states,
-        this.hass ? this.hass.states : this._pendingHass.states
+      }),
-      ),
+      entities: new ContextProvider(this, {
-      entities: new ContextProvider(
+        context: entitiesContext,
-        this,
+        initialValue: this.hass
-        entitiesContext,
+          ? this.hass.entities
-        this.hass ? this.hass.entities : this._pendingHass.entities
+          : this._pendingHass.entities,
-      ),
+      }),
-      devices: new ContextProvider(
+      devices: new ContextProvider(this, {
-        this,
+        context: devicesContext,
-        devicesContext,
+        initialValue: this.hass ? this.hass.devices : this._pendingHass.devices,
-        this.hass ? this.hass.devices : this._pendingHass.devices
+      }),
-      ),
+      areas: new ContextProvider(this, {
-      areas: new ContextProvider(
+        context: areasContext,
-        this,
+        initialValue: this.hass ? this.hass.areas : this._pendingHass.areas,
-        areasContext,
+      }),
-        this.hass ? this.hass.areas : this._pendingHass.areas
+      localize: new ContextProvider(this, {
-      ),
+        context: localizeContext,
-      localize: new ContextProvider(
+        initialValue: this.hass
-        this,
+          ? this.hass.localize
-        localizeContext,
+          : this._pendingHass.localize,
-        this.hass ? this.hass.localize : this._pendingHass.localize
+      }),
-      ),
+      locale: new ContextProvider(this, {
-      locale: new ContextProvider(
+        context: localeContext,
-        this,
+        initialValue: this.hass ? this.hass.locale : this._pendingHass.locale,
-        localeContext,
+      }),
-        this.hass ? this.hass.locale : this._pendingHass.locale
+      config: new ContextProvider(this, {
-      ),
+        context: configContext,
-      config: new ContextProvider(
+        initialValue: this.hass ? this.hass.config : this._pendingHass.config,
-        this,
+      }),
-        configContext,
+      themes: new ContextProvider(this, {
-        this.hass ? this.hass.config : this._pendingHass.config
+        context: themesContext,
-      ),
+        initialValue: this.hass ? this.hass.themes : this._pendingHass.themes,
-      themes: new ContextProvider(
+      }),
-        this,
+      selectedTheme: new ContextProvider(this, {
-        themesContext,
+        context: selectedThemeContext,
-        this.hass ? this.hass.themes : this._pendingHass.themes
+        initialValue: this.hass
-      ),
+          ? this.hass.selectedTheme
-      selectedTheme: new ContextProvider(
+          : this._pendingHass.selectedTheme,
-        this,
+      }),
-        selectedThemeContext,
+      user: new ContextProvider(this, {
-        this.hass ? this.hass.selectedTheme : this._pendingHass.selectedTheme
+        context: userContext,
-      ),
+        initialValue: this.hass ? this.hass.user : this._pendingHass.user,
-      user: new ContextProvider(
+      }),
-        this,
+      userData: new ContextProvider(this, {
-        userContext,
+        context: userDataContext,
-        this.hass ? this.hass.user : this._pendingHass.user
+        initialValue: this.hass
-      ),
+          ? this.hass.userData
-      userData: new ContextProvider(
+          : this._pendingHass.userData,
-        this,
+      }),
-        userDataContext,
+      panels: new ContextProvider(this, {
-        this.hass ? this.hass.userData : this._pendingHass.userData
+        context: panelsContext,
-      ),
+        initialValue: this.hass ? this.hass.panels : this._pendingHass.panels,
-      panels: new ContextProvider(
+      }),
-        this,
-        panelsContext,
-        this.hass ? this.hass.panels : this._pendingHass.panels
-      ),
     };
 
     protected _updateHass(obj: Partial<HomeAssistant>) {

yarn.lock

@@ -1955,13 +1955,13 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@lit-labs/context@npm:0.2.0":
+"@lit-labs/context@npm:0.3.0":
-  version: 0.2.0
+  version: 0.3.0
-  resolution: "@lit-labs/context@npm:0.2.0"
+  resolution: "@lit-labs/context@npm:0.3.0"
   dependencies:
     "@lit/reactive-element": ^1.5.0
-    lit: ^2.5.0
+    lit: ^2.7.0
-  checksum: 0b3d803ba81683d9650ba384e5f138656ecd52d6a54448535e867e0a0ba0cb23e4526ec52e82ed657e9c3598a103c0e8b164bfe927222467e349fb070c770af3
+  checksum: 85c66a67d12d3a9e3753337ef8f5566789ccacbb98b40b01c79db98ea6186c0bcdb5c16b4a27673cd5b4fb807bf3970c376b8c96797a9b20a78b0681f391efdb
   languageName: node
   linkType: hard
 
@@ -9425,7 +9425,7 @@ __metadata:
     "@fullcalendar/timegrid": 6.1.5
     "@koa/cors": 4.0.0
     "@lezer/highlight": 1.1.4
-    "@lit-labs/context": 0.2.0
+    "@lit-labs/context": 0.3.0
     "@lit-labs/motion": 1.0.3
     "@lit-labs/virtualizer": 1.0.1
     "@lrnwebcomponents/simple-tooltip": 4.1.0
@@ -11238,7 +11238,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"lit@npm:2.7.0, lit@npm:^2.0.0, lit@npm:^2.0.0-rc.2, lit@npm:^2.2.1, lit@npm:^2.2.8, lit@npm:^2.3.0, lit@npm:^2.5.0":
+"lit@npm:2.7.0, lit@npm:^2.0.0, lit@npm:^2.0.0-rc.2, lit@npm:^2.2.1, lit@npm:^2.2.8, lit@npm:^2.3.0, lit@npm:^2.5.0, lit@npm:^2.7.0":
   version: 2.7.0
   resolution: "lit@npm:2.7.0"
   dependencies: