Check the named entity's state/attribute when hiding

README.md

@@ -150,15 +150,17 @@ The `format` option supports the following values:
 
 ### Hiding
 
-The `hide_if` option can be used to hide an entity if its state or attribute value matches the specified criteria.
+The `hide_if` option can be used to hide an entity if an entity's state or attribute value matches the specified criteria.
 It can be used directly with a string, number or boolean value (i.e. `hide_if: 'off'`), as a list with several values,
 or as an object with one or more of the options listed below.
 
-| Name    | Type     | Description                                                     |
-| ------- | -------- | --------------------------------------------------------------- |
-| above   | number   | Hidden if entity _number_ value is above the specified value    |
-| below   | number   | Hidden if entity _number_ value is below the specified value    |
-| value   | list/any | Hidden if value matches specified value or any value in a list  |
+| Name      | Type     | Description                                                            |
+| --------- | -------- | ---------------------------------------------------------------------- |
+| above     | number   | Hidden if entity _number_ value is above the specified value           |
+| below     | number   | Hidden if entity _number_ value is below the specified value           |
+| value     | list/any | Hidden if value matches specified value or any value in a list         |
+| entity    | string   | Use this entity's state/attribute when evaluating criteria for hiding  |
+| attribute | string   | Use this attribute's value when evaluating criteria for hiding         |
 
 ## Examples
 

src/index.js

@@ -3,7 +3,14 @@ import { handleClick } from 'custom-card-helpers';
 
 import { LAST_CHANGED, LAST_UPDATED, TIMESTAMP_FORMATS } from './lib/constants';
 import { checkEntity, entityName, entityStateDisplay, entityStyles } from './entity';
-import { getEntityIds, hasConfigOrEntitiesChanged, hasGenericSecondaryInfo, hideIf, isObject } from './util';
+import {
+    getEntityIds,
+    getHideIfStateObj,
+    hasConfigOrEntitiesChanged,
+    hasGenericSecondaryInfo,
+    hideIf,
+    isObject,
+} from './util';
 import { style } from './styles';
 
 console.info(
@@ -84,7 +91,7 @@ class MultipleEntityRow extends LitElement {
         if (
             !this.config.secondary_info ||
             hasGenericSecondaryInfo(this.config.secondary_info) ||
-            hideIf(this.info, this.config.secondary_info)
+            hideIf(getHideIfStateObj(this._hass, this.info, this.config.secondary_info), this.config.secondary_info)
         ) {
             return null;
         }
@@ -106,7 +113,7 @@ class MultipleEntityRow extends LitElement {
     }
 
     renderEntity(stateObj, config) {
-        if (!stateObj || hideIf(stateObj, config)) {
+        if (!stateObj || hideIf(getHideIfStateObj(this._hass, stateObj, config), config)) {
             return null;
         }
         const onClick = this.clickHandler(stateObj.entity_id, config.tap_action);

src/util.js

@@ -53,3 +53,9 @@ export const hasConfigOrEntitiesChanged = (node, changedProps) => {
     }
     return false;
 };
+
+export const getHideIfStateObj = (hass, stateObj, config) => {
+    if (!hass || !config.hide_if || !config.hide_if.entity) return stateObj;
+    const hideObj = hass.states[config.hide_if.entity];
+    return hideObj ? hideObj : stateObj;
+};