mirror of
https://github.com/home-assistant/home-assistant.io.git
synced 2025-07-27 19:26:50 +00:00
Lovelace: custom badges and state-badge actions (#10915)
* custom badges and state-badge actions * address comments * format * image option for state-label * Fix build Co-authored-by: Franck Nijhof <frenck@frenck.nl>
This commit is contained in:
Ian Richardson
Franck Nijhof
parent
5fc838deb1
commit
046b281fb7
@ -62,6 +62,111 @@ title:
|
|||||||
required: false
|
required: false
|
||||||
description: State badge tooltip. Set to null to hide.
|
description: State badge tooltip. Set to null to hide.
|
||||||
type: string
|
type: string
|
||||||
|
tap_action:
|
||||||
|
required: false
|
||||||
|
description: Action to take on tap
|
||||||
|
type: map
|
||||||
|
keys:
|
||||||
|
action:
|
||||||
|
required: true
|
||||||
|
description: "Action to perform (`more-info`, `toggle`, `call-service`, `navigate`, `url`, `none`)"
|
||||||
|
type: string
|
||||||
|
default: "`toggle`"
|
||||||
|
navigation_path:
|
||||||
|
required: false
|
||||||
|
description: "Path to navigate to (e.g. `/lovelace/0/`) when `action` defined as `navigate`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
url_path:
|
||||||
|
required: false
|
||||||
|
description: "Path to navigate to (e.g. `https://www.home-assistant.io`) when `action` defined as `url`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
service:
|
||||||
|
required: false
|
||||||
|
description: "Service to call (e.g. `media_player.media_play_pause`) when `action` defined as `call-service`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
service_data:
|
||||||
|
required: false
|
||||||
|
description: "Service data to include (e.g. `entity_id: media_player.bedroom`) when `action` defined as `call-service`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
confirmation:
|
||||||
|
required: false
|
||||||
|
description: "Present a confirmation dialog to confirm the action. See `confirmation` object below"
|
||||||
|
type: [boolean, map]
|
||||||
|
default: "false"
|
||||||
|
hold_action:
|
||||||
|
required: false
|
||||||
|
description: Action to take on tap-and-hold
|
||||||
|
type: map
|
||||||
|
keys:
|
||||||
|
action:
|
||||||
|
required: true
|
||||||
|
description: "Action to perform (`more-info`, `toggle`, `call-service`, `navigate`, `url`, `none`)"
|
||||||
|
type: string
|
||||||
|
default: "`more-info`"
|
||||||
|
navigation_path:
|
||||||
|
required: false
|
||||||
|
description: "Path to navigate to (e.g. `/lovelace/0/`) when `action` defined as `navigate`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
url_path:
|
||||||
|
required: false
|
||||||
|
description: "Path to navigate to (e.g. `https://www.home-assistant.io`) when `action` defined as `url`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
service:
|
||||||
|
required: false
|
||||||
|
description: "Service to call (e.g. `media_player.media_play_pause`) when `action` defined as `call-service`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
service_data:
|
||||||
|
required: false
|
||||||
|
description: "Service data to include (e.g. `entity_id: media_player.bedroom`) when `action` defined as `call-service`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
confirmation:
|
||||||
|
required: false
|
||||||
|
description: "Present a confirmation dialog to confirm the action. See `confirmation` object below"
|
||||||
|
type: [boolean, map]
|
||||||
|
default: "false"
|
||||||
|
double_tap_action:
|
||||||
|
required: false
|
||||||
|
description: Action to take on double tap
|
||||||
|
type: map
|
||||||
|
keys:
|
||||||
|
action:
|
||||||
|
required: true
|
||||||
|
description: "Action to perform (`more-info`, `toggle`, `call-service`, `navigate`, `url`, `none`)"
|
||||||
|
type: string
|
||||||
|
default: "`more-info`"
|
||||||
|
navigation_path:
|
||||||
|
required: false
|
||||||
|
description: "Path to navigate to (e.g. `/lovelace/0/`) when `action` defined as `navigate`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
url_path:
|
||||||
|
required: false
|
||||||
|
description: "Path to navigate to (e.g. `https://www.home-assistant.io`) when `action` defined as `url`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
service:
|
||||||
|
required: false
|
||||||
|
description: "Service to call (e.g. `media_player.media_play_pause`) when `action` defined as `call-service`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
service_data:
|
||||||
|
required: false
|
||||||
|
description: "Service data to include (e.g. `entity_id: media_player.bedroom`) when `action` defined as `call-service`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
confirmation:
|
||||||
|
required: false
|
||||||
|
description: "Present a confirmation dialog to confirm the action. See `confirmation` object below"
|
||||||
|
type: [boolean, map]
|
||||||
|
default: "false"
|
||||||
{% endconfiguration %}
|
{% endconfiguration %}
|
||||||
|
|
||||||
### Icon representing an entity state
|
### Icon representing an entity state
|
||||||
|
|||||||
@ -57,11 +57,234 @@ views:
|
|||||||
default: true
|
default: true
|
||||||
{% endconfiguration %}
|
{% endconfiguration %}
|
||||||
|
|
||||||
## Options For Badges
|
## Options For Visible
|
||||||
|
|
||||||
If you define badges as objects instead of strings (by adding `entity:` before entity ID), allowing you to add more customizations:
|
If you define `visible` as objects instead of a boolean to specify conditions for displaying the view tab:
|
||||||
|
|
||||||
{% configuration badges %}
|
{% configuration badges %}
|
||||||
|
user:
|
||||||
|
required: true
|
||||||
|
description: User id that can see the view tab.
|
||||||
|
type: string
|
||||||
|
{% endconfiguration %}
|
||||||
|
|
||||||
|
## Badges
|
||||||
|
|
||||||
|
### State Label Badge
|
||||||
|
|
||||||
|
The State Label badge allows you to dislay a state badge
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
type: state-label
|
||||||
|
entity: light.living_room
|
||||||
|
```
|
||||||
|
|
||||||
|
{% configuration state_label %}
|
||||||
|
type:
|
||||||
|
required: true
|
||||||
|
description: entity-button
|
||||||
|
type: string
|
||||||
|
entity:
|
||||||
|
required: true
|
||||||
|
description: Home Assistant entity ID.
|
||||||
|
type: string
|
||||||
|
name:
|
||||||
|
required: false
|
||||||
|
description: Overwrites friendly name.
|
||||||
|
type: string
|
||||||
|
default: Name of Entity
|
||||||
|
icon:
|
||||||
|
required: false
|
||||||
|
description: Overwrites icon or entity picture.
|
||||||
|
type: string
|
||||||
|
default: Entity Domain Icon
|
||||||
|
image:
|
||||||
|
required: false
|
||||||
|
description: The URL of an image.
|
||||||
|
type: string
|
||||||
|
show_name:
|
||||||
|
required: false
|
||||||
|
description: Show name.
|
||||||
|
type: boolean
|
||||||
|
default: "true"
|
||||||
|
show_icon:
|
||||||
|
required: false
|
||||||
|
description: Show icon.
|
||||||
|
type: boolean
|
||||||
|
default: "true"
|
||||||
|
tap_action:
|
||||||
|
required: false
|
||||||
|
description: Action to take on tap
|
||||||
|
type: map
|
||||||
|
keys:
|
||||||
|
action:
|
||||||
|
required: true
|
||||||
|
description: "Action to perform (`more-info`, `toggle`, `call-service`, `navigate`, `url`, `none`)"
|
||||||
|
type: string
|
||||||
|
default: "`toggle`"
|
||||||
|
navigation_path:
|
||||||
|
required: false
|
||||||
|
description: "Path to navigate to (e.g. `/lovelace/0/`) when `action` defined as `navigate`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
url_path:
|
||||||
|
required: false
|
||||||
|
description: "Path to navigate to (e.g. `https://www.home-assistant.io`) when `action` defined as `url`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
service:
|
||||||
|
required: false
|
||||||
|
description: "Service to call (e.g. `media_player.media_play_pause`) when `action` defined as `call-service`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
service_data:
|
||||||
|
required: false
|
||||||
|
description: "Service data to include (e.g. `entity_id: media_player.bedroom`) when `action` defined as `call-service`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
confirmation:
|
||||||
|
required: false
|
||||||
|
description: "Present a confirmation dialog to confirm the action. See `confirmation` object below"
|
||||||
|
type: [boolean, map]
|
||||||
|
default: "false"
|
||||||
|
hold_action:
|
||||||
|
required: false
|
||||||
|
description: Action to take on tap-and-hold
|
||||||
|
type: map
|
||||||
|
keys:
|
||||||
|
action:
|
||||||
|
required: true
|
||||||
|
description: "Action to perform (`more-info`, `toggle`, `call-service`, `navigate`, `url`, `none`)"
|
||||||
|
type: string
|
||||||
|
default: "`more-info`"
|
||||||
|
navigation_path:
|
||||||
|
required: false
|
||||||
|
description: "Path to navigate to (e.g. `/lovelace/0/`) when `action` defined as `navigate`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
url_path:
|
||||||
|
required: false
|
||||||
|
description: "Path to navigate to (e.g. `https://www.home-assistant.io`) when `action` defined as `url`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
service:
|
||||||
|
required: false
|
||||||
|
description: "Service to call (e.g. `media_player.media_play_pause`) when `action` defined as `call-service`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
service_data:
|
||||||
|
required: false
|
||||||
|
description: "Service data to include (e.g. `entity_id: media_player.bedroom`) when `action` defined as `call-service`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
confirmation:
|
||||||
|
required: false
|
||||||
|
description: "Present a confirmation dialog to confirm the action. See `confirmation` object below"
|
||||||
|
type: [boolean, map]
|
||||||
|
default: "false"
|
||||||
|
double_tap_action:
|
||||||
|
required: false
|
||||||
|
description: Action to take on double tap
|
||||||
|
type: map
|
||||||
|
keys:
|
||||||
|
action:
|
||||||
|
required: true
|
||||||
|
description: "Action to perform (`more-info`, `toggle`, `call-service`, `navigate`, `url`, `none`)"
|
||||||
|
type: string
|
||||||
|
default: "`more-info`"
|
||||||
|
navigation_path:
|
||||||
|
required: false
|
||||||
|
description: "Path to navigate to (e.g. `/lovelace/0/`) when `action` defined as `navigate`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
url_path:
|
||||||
|
required: false
|
||||||
|
description: "Path to navigate to (e.g. `https://www.home-assistant.io`) when `action` defined as `url`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
service:
|
||||||
|
required: false
|
||||||
|
description: "Service to call (e.g. `media_player.media_play_pause`) when `action` defined as `call-service`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
service_data:
|
||||||
|
required: false
|
||||||
|
description: "Service data to include (e.g. `entity_id: media_player.bedroom`) when `action` defined as `call-service`"
|
||||||
|
type: string
|
||||||
|
default: none
|
||||||
|
confirmation:
|
||||||
|
required: false
|
||||||
|
description: "Present a confirmation dialog to confirm the action. See `confirmation` object below"
|
||||||
|
type: [boolean, map]
|
||||||
|
default: "false"
|
||||||
|
{% endconfiguration %}
|
||||||
|
|
||||||
|
#### Options For Confirmation
|
||||||
|
|
||||||
|
If you define confirmation as an object instead of boolean, you can add more customization and configurations:
|
||||||
|
{% configuration confirmation %}
|
||||||
|
text:
|
||||||
|
required: false
|
||||||
|
description: Text to present in the confirmation dialog.
|
||||||
|
type: string
|
||||||
|
exemptions:
|
||||||
|
required: false
|
||||||
|
description: "List of `exemption` objects. See below"
|
||||||
|
type: list
|
||||||
|
{% endconfiguration %}
|
||||||
|
|
||||||
|
#### Options For Exemptions
|
||||||
|
|
||||||
|
{% configuration badges %}
|
||||||
|
user:
|
||||||
|
required: true
|
||||||
|
description: User id that can see the view tab.
|
||||||
|
type: string
|
||||||
|
{% endconfiguration %}
|
||||||
|
|
||||||
|
#### Example
|
||||||
|
|
||||||
|
View config:
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
- title: Living room
|
||||||
|
badges:
|
||||||
|
- device_tracker.demo_paulus
|
||||||
|
- entity: light.ceiling_lights
|
||||||
|
name: Ceiling Lights
|
||||||
|
icon: mdi:bulb
|
||||||
|
- entity: switch.decorative_lights
|
||||||
|
image: /local/lights.png
|
||||||
|
```
|
||||||
|
|
||||||
|
### Entity Filter Badge
|
||||||
|
|
||||||
|
This badge allows you to define a list of entities that you want to track only when in a certain state. Very useful for showing lights that you forgot to turn off or show a list of people only when they're at home.
|
||||||
|
|
||||||
|
{% configuration filter_badge %}
|
||||||
|
type:
|
||||||
|
required: true
|
||||||
|
description: entity-filter
|
||||||
|
type: string
|
||||||
|
entities:
|
||||||
|
required: true
|
||||||
|
description: A list of entity IDs or `entity` objects, see below.
|
||||||
|
type: list
|
||||||
|
state_filter:
|
||||||
|
required: true
|
||||||
|
description: List of strings representing states or `filter` objects, see below.
|
||||||
|
type: list
|
||||||
|
{% endconfiguration %}
|
||||||
|
|
||||||
|
#### Options For Entities
|
||||||
|
|
||||||
|
If you define entities as objects instead of strings (by adding `entity:` before entity ID), you can add more customization and configurations:
|
||||||
|
|
||||||
|
{% configuration entities %}
|
||||||
|
type:
|
||||||
|
required: false
|
||||||
|
description: "Sets a custom badge type: `custom:my-custom-badge`"
|
||||||
|
type: string
|
||||||
entity:
|
entity:
|
||||||
required: true
|
required: true
|
||||||
description: Home Assistant entity ID.
|
description: Home Assistant entity ID.
|
||||||
@ -78,32 +301,62 @@ image:
|
|||||||
required: false
|
required: false
|
||||||
description: The URL of an image.
|
description: The URL of an image.
|
||||||
type: string
|
type: string
|
||||||
|
state_filter:
|
||||||
|
required: false
|
||||||
|
description: List of strings representing states or `filter` objects, see below.
|
||||||
|
type: list
|
||||||
{% endconfiguration %}
|
{% endconfiguration %}
|
||||||
|
|
||||||
## Options For Visible
|
#### Options For state_filter
|
||||||
|
|
||||||
If you define `visible` as objects instead of a boolean to specify conditions for displaying the view tab:
|
If you define state_filter as objects instead of strings (by adding `value:` before your state value), you can add more customization to your filter:
|
||||||
|
|
||||||
{% configuration badges %}
|
{% configuration state_filter %}
|
||||||
user:
|
value:
|
||||||
required: true
|
required: true
|
||||||
description: User id that can see the view tab.
|
description: String representing the state.
|
||||||
|
type: string
|
||||||
|
operator:
|
||||||
|
required: false
|
||||||
|
description: Operator to use in the comparison. Can be `==`, `<=`, `<`, `>=`, `>`, `!=` or `regex`.
|
||||||
|
type: string
|
||||||
|
attribute:
|
||||||
|
required: false
|
||||||
|
description: Attribute of the entity to use instead of the state.
|
||||||
type: string
|
type: string
|
||||||
{% endconfiguration %}
|
{% endconfiguration %}
|
||||||
|
|
||||||
### Example
|
#### Examples
|
||||||
|
|
||||||
View config:
|
Show only active switches or lights in the house
|
||||||
|
|
||||||
```yaml
|
```yaml
|
||||||
- title: Living room
|
type: entity-filter
|
||||||
badges:
|
entities:
|
||||||
- device_tracker.demo_paulus
|
- entity: light.bed_light
|
||||||
- entity: light.ceiling_lights
|
name: Bed
|
||||||
name: Ceiling Lights
|
- light.kitchen_lights
|
||||||
icon: mdi:bulb
|
- light.ceiling_lights
|
||||||
- entity: switch.decorative_lights
|
state_filter:
|
||||||
image: /local/lights.png
|
- "on"
|
||||||
|
```
|
||||||
|
|
||||||
|
Specify filter for a single entity
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
type: entity-filter
|
||||||
|
state_filter:
|
||||||
|
- "on"
|
||||||
|
- operator: ">"
|
||||||
|
value: 90
|
||||||
|
entities:
|
||||||
|
- sensor.water_leak
|
||||||
|
- sensor.outside_temp
|
||||||
|
- entity: sensor.humidity_and_temp
|
||||||
|
state_filter:
|
||||||
|
- operator: ">"
|
||||||
|
value: 50
|
||||||
|
attribute: humidity
|
||||||
```
|
```
|
||||||
|
|
||||||
## Paths
|
## Paths
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user