Skip to content

Visibility

Use visibility to choose whether a tool or control is shown and available.

Value Result
visible Shows the item normally.
hidden Hides the item.
unavailable Shows a control as unavailable and prevents interaction.

Hide an item

1
2
3
4
5
- id: optional-label
  text: Extra details
  xpos: 50
  ypos: 80
  visibility: hidden

Change visibility from a state

1
2
3
4
5
6
visibility: |
  [[[
    return entities[entity_slots.show_details[0]].state === 'on'
      ? 'visible'
      : 'hidden';
  ]]]

Disable an unavailable control

Use unavailable when the control should remain visible but cannot be used for the current choice:

1
2
3
4
5
6
visibility: |
  [[[
    return entities[entity_slots.chart_type[0]].state === 'dots'
      ? 'unavailable'
      : 'visible';
  ]]]

The control applies its unavailable appearance and ignores interaction.

Show and hide a group

Set visibility on a group to affect all tools placed inside it. See Groups.