Configuration

Configuration Options

This Strategy has a sensible default configuration, which is the one i myself use!

You can start without configuring anything. If you want to change something take a look at the Configuration Documentation.

Click for Configuration Options

option	description	type	required	default	example
tabs	Tabs shown in the main area. More You can also reference tab entries from the default config by just writing '~' + title of tab. With that you can easily change a single tab while just referencing the other without the need to copy the whole config. Example: - ~Stats instead of whole config	Array	yes	set	tabs: - label: Test icon: mdi:test rows: #Row Config here - ~Camera - ~Stats
areaColors	Overlay Colors for navigation area. Must be in the form of a rgba css-value. rgb defines the color and the a-channel defines transparency. The colors get repeated when you have more areas than colors. Leave empty for no overlay.	Array	yes	set	areaColors: - rgba(0,0,0,0.5)
areaCardConfig	The config for the area card. Options type, area, navigation_path are not allowed!	Object	yes	set	areaCardConfig: aspect_ratio: 1:1
areaBlacklist	Which areas should be ignored (no views generated/not shown in navigation)	Array	no	-	areaBlacklist: - living_room - bathroom
topCards	Slot for cards above navigation. More	Array	no	-	topCards: - type: entity entities: - button.test - button.test2
extraViews	You can pass any extra views you want on the dashboard.	Array	no	-	extraViews: - strategy: type: custom:battery-view-strategy icon: mdi:test path: test title: Test
minColumnWidth	Minimal Column Width in the Grid = The Minimal Width of the Cards.	number	yes	set for area-dashboard-strategy set for all other strategies	minColumnWidth: 300
replaceCards	You can set a card to be used for a specific entity. Overwrites default card config	Object	no	-	replaceCards: button.test: type: entity entities: - $entity

So valid YAML for this could look like this:

---
strategy:
  type: custom:area-dashboard-strategy
  config:
    tabs:
    - label: Test
      icon: mdi:test
      rows:
    - "~Camera"
    - "~Stats"
    areaColors:
    - rgba(0,0,0,0.5)
    areaCardConfig:
      aspect_ratio: 3660
    areaBlacklist:
    - living_room
    - bathroom
    topCards:
    - type: entity
      entities:
      - button.test
      - button.test2
    extraViews:
    - strategy:
        type: custom:battery-view-strategy
      icon: mdi:test
      path: test
      title: Test
    minColumnWidth: 300
    replaceCards:
      button.test:
        type: entity
        entities:
        - "$entity"

I used all available options in this example. You don`t need to do this! Take a look at the required fields for what you need!

Tabs

The tabs shown in the the main section.

Define as many Tabs as you want. The Tab will only be shown in the View per Area when it has content.

Example: if the Living Room has a Tab where none of the rows would have entities (like Camera, which has only one row and can easily be empty) the whole Tab is hidden.

Click for Configuration Options

option	description	type	required	example
title	Title shown in the Tab	string	yes	title: Test
icon	Icon shown in the Tab	string	yes	icon: mdi:test
rows	The grid rows definition of the tab. More You can also reference row entries from the default config by just writing '~' + title of row. With that you can easily change a single row while just referencing the other without the need to copy the whole config. Example: - ~Buttons instead of whole config	Array	yes	rows: - title: test card: type: tile filter: include: - type: domain value: media_player - title: test2 card: type: tile filter: include: - type: domain value: sensor

So valid YAML for this could look like this:

---
title: Test
icon: mdi:test
rows:
- title: test
  card:
    type: tile
  filter:
    include:
    - type: domain
      value: media_player
- title: test2
  card:
    type: tile
  filter:
    include:
    - type: domain
      value: sensor

I used all available options in this example. You don`t need to do this! Take a look at the required fields for what you need!

Content/Rows

Every Row consists of a (optional) title and a Grid with all the cards for the entities. The row is defined by:

Click for Configuration Options

option	description	type	required	example
title	Title shown over Grid. Will not be rendered when not set.	string	no	title: Buttons
filter	Define include and exclude function for more fine-grained control of entities selected for row than only domain. A entity needs to match all include filters to be included but it needs only to match one of the exclude filters to be excluded!		no	filter: include: - type: domain value: binary_sensor - type: state value: on exclude: - type: entity value: sensor.test123 - type: state comparator: is_null - type: area value: living_room
card	The cardConfig of the card that should be rendered for every entity in the grid. You can use all cards you would normally use in your dashboard! You can insert the entityId of the entity with the $entity variable which will be replaced in the whole object by the entities entity_id.	Object	yes	card: type: tile entity: $entity iconColor: red
domain	Domain or Array of domains the entity must belong to. Will be deprecated in: v2.0.0 Include filter should be used from now on.		no	domain: - button - media_player

So valid YAML for this could look like this:

---
domain:
- button
- media_player
title: Buttons
filter:
  include:
  - type: domain
    value: binary_sensor
  - type: state
    value: true
  exclude:
  - type: entity
    value: sensor.test123
  - type: state
    comparator: is_null
  - type: area
    value: living_room
card:
  type: tile
  entity: "$entity"
  iconColor: red

I used all available options in this example. You don`t need to do this! Take a look at the required fields for what you need!

Filter

Filters can be defined for fine-grained control which entities should be matched. You can use both include and exclude as keys. Both are optional.

filter:
  include:
    - ...
  exclude:
    - ...

Both accept the same types and syntax.

An entity needs to match all include filters to be included but it needs only to match one of the exclude filters to be excluded!

The filter object looks like this.

Click for Configuration Options

option	description	type	required	example
type	The type of filter to determine the value or just specify the filter	Object	yes	type: state
comparator	The comparator to use to compare the left value (the value in the entity described by the type) and the right value (the user specified value)	Object	no	comparator: equal
value	The user specified value	unknown	no	value: on

So valid YAML for this could look like this:

---
type: state
comparator: equal
value: true

I used all available options in this example. You don`t need to do this! Take a look at the required fields for what you need!

Filter Type

These are the options for filter type.

Click for Configuration Options

option	description	example
entity	Filter on the entity_id of the entity. entity_id not Entity Name or Display Name! Some ways to find it explained here	- type: entity comparator: equal value: sensor.test123
domain	Filter on the domain of the entity.	- type: domain comparator: equal value: sensor
device	Filter on the parent device_id of the entity. device_id not Device Name or Display Name! Some ways to find it explained here	- type: device comparator: equal value: 98b750a482bbf28ea959269981813219
area	Filter on the area_id of the entity. area_id not Area Name or Display Name! Find at "https://YourHA/config/areas/dashboard". Edit Area = shows area_id	- type: area comparator: equal value: living_room
integration	Filter on the integration of the entity. Needs to be the id of the integration not the name! More on how to find it here	- type: integration comparator: equal value: mqtt
label	Filter on the label of the entity. Needs to be the id of the label not the name! More on how to find it here	- type: label comparator: equal value: sort_1
state	Filter on the state of the entity.	- type: state comparator: equal value: on
attribute	Filter on an attribute of the entity. Needs a special value structure with another object with key + value, where key is the desired attribute	- type: attribute comparator: equal value: key: volume value: 100
disabled_by	Filter on the disabled_by state of the entity. Possible Disablers here	- type: disabled_by comparator: match value: .*
hidden_by	Filter on the hidden_by state of the entity. Possible Hiders here	- type: hidden_by comparator: match value: .*
entity_category	Filter on the category of the entity.	- type: entity_category comparator: equal value: diagnostic

Filter Comparator

These are the options for filter comparator.

Click for Configuration Options

option	description	example
equal	Check if the selected type value of the entity and the passed value are equal.	- type: state comparator: equal value: on
match	Check if the selected type value of the entity matches against the passed regexp value. Regexp can be tested here	- type: entity comparator: match value: .*_occupancy
in	Check if the selected type value of the entity is in the list of defined values. value needs to be an array!	- type: state comparator: in value: - on - off
greater_than	Check if the selected type value of the entity is greater than the defined value. Works only on numeric type values and defined values!	- type: state comparator: greater_than value: 5
lower_than	Check if the selected type value of the entity is lower than the defined value. Works only on numeric type values and defined values!	- type: state comparator: lower_than value: 5
is_null	Check if the selected type value of the entity is null. Does not need a value defined! Exception is type: attribute as it needs key for attribute name!	- type: state comparator: is_null
is_numeric	Check if the selected type value of the entity is numeric. Does not need a value defined! Exception is type: attribute as it needs key for attribute name!	- type: attribute comparator: is_numeric value: key: volume

Default Config explained

The default config is written as yaml. This should make it easy to make your own changes because it is written exactly as you would in your dashboard.

You can find it here.

The Area Cards shows only device_type: occupancy as an alarm icon and temperature as info.

Area Card