joseluis9595/lovelace-navbar-card v0.13.0

NavbarCard v0.13.0

on GitHub

It's August, the sun’s out, and after taking a bit of time off to enjoy summer, I’m back with a small but useful update to navbar-card. This release is all about giving you more control and flexibility when using JSTemplate for customising your dashboard.

Access Internal State in JSTemplates

You can now access the internal state of navbar-card from within JSTemplate functions. Currently, the only exposed parameter is navbar.isDesktop, which indicates whether the card is being rendered in desktop or mobile view.

This opens up lots of possibilities, like showing/hiding routes in mobile mode, switching icons, showing/hiding badges only for desktop devices... etc

type: custom:navbar-card
routes:
  ...
  - url: /lovelace/lights
    label: Lights
    icon: mdi:lightbulb-outline
    hidden: |
      [[[ return navbar.isDesktop; ]]]

JSTemplate support for icons and images

Building on the customisation improvements, all route-level icon and image properties now support JSTemplates. That is icon, icon_selected, image and image_selected.

type: custom:navbar-card
routes:
  - url: /lovelace/home
    icon: |
      [[[ return navbar.isDesktop ? "mdi:home" : "mdi:phone-classic" ]]]
    label: Home
...

All changes

• Add support for JSTemplates in icon, icon_selected, image and image_selected.
• Allow accessing internal navbar state from JSTemplate functions. (closes #98 )