100% Templatable Lovelace Configurations

Tags: #<Tag:0x00007fd0786cddb0> #<Tag:0x00007fd0786cdba8>


@arsaboo Haven’t you missed off a config?

In any case this doesn’t work either.

  - type: custom:config-template-card
      type: custom:hui-entities-card
      title: TESTING
        - entity: switch.hall_light
          icon: "${this.hass.states['switch.hall_light'].state === 'on' ? 'mdi:music' : 'mdi:sleep'}"


Add some logs, might be a bug in the traversing of the nested objects

Edit: Yeah there probably is, I think i ONLY did objects and not lists :man_facepalming: maybe someone can check it out.


@Mariusthvdb, didn’t you want this



Added the two lines:


But didn’t increase any “logging level” in the console


As I said above, likely a bug on lists


It can be, I am working with multiple objects inside “config”

Also the temperature one was “- type”



Doesn’t @everyone ?! :star_struck:


Yes sorry, writing during tests so I didn’t scroll all the way down before hitting “Reply” :smiley:


haha probably! I don’t see a use for it yet but I’ve only glanced at the git page. If I can leverage this to simplify conditional cards, then that will be a great benefit. I’m gonna look into that when I get home.


I’ll check it out tonight, but pretty much need another conditional checking if it is an array, and if so handle the array as a whole before applying back to the key value


So I think you’re right, that might be the issue, because now I changed the temperature one to this code:

                  - type: custom:config-template-card
                      type: custom:mini-graph-card
                      name: Outside
                      icon: "${this.hass.states['sensor.dark_sky_temperature'].state >= 10 ? 'mdi:thermometer-chevron-up' : 'mdi:thermometer-chevron-down'}"
#                      icon: mdi:thermometer
                      more_info: false
                      group: false
                        - sensor.dark_sky_temperature
                      hour24: true
                        graph: false
                        icon: true
                        extrema: true
                        fill: false
                      align_state: center

And in the console I see something new (it doesn’t work still, but still it’s something different)

config-template-card.js?track=true:1838 Uncaught (in promise) RangeError: Maximum call stack size exceeded
    at Array.forEach (<anonymous>)
    at HTMLElement._evaluateConfig (config-template-card.js?track=true:2311)
    at Object.entries.forEach.entry (config-template-card.js?track=true:2315)
    at Array.forEach (<anonymous>)
    at HTMLElement._evaluateConfig (config-template-card.js?track=true:2311)
    at Object.entries.forEach.entry (config-template-card.js?track=true:2315)
    at Array.forEach (<anonymous>)
    at HTMLElement._evaluateConfig (config-template-card.js?track=true:2311)
    at Object.entries.forEach.entry (config-template-card.js?track=true:2315)
    at Array.forEach (<anonymous>)


Infinite loop…:kissing: perfection…


@iantrich Would you be willing to post a run down of what is needed to compile this? I’m thinking of contributing, but I’ve not yet compiled any typescript stuff for HA.



npm install or yarn install
npm run rollup


That was disturbingly easy. I should have figured that out myself. Thanks!



Side note, this is still not working even if I don’t use a list

              - type: custom:config-template-cardx
                  type: entities
                  title: House Members
                  show_header_toggle: false
                    - entity: person.andrea
                      type: "custom:secondaryinfo-entity-row"
                      secondary_info: "${this.hass.states['binary_sensor.andrea_oneplus5_charging'].state === 'true' ? 'Charging' : 'Not Charging'}"

I am wondering if there is also something that doesn’t work with the way that the “custom:secondaryinfo-entity-row” works


entities is a list


Fair enough, I tought you were referring to list of cards only :slight_smile:


Would something like the following work assuming the lists thing is fixed?

- type: custom:config-template-card
    type: vertical-stack
    cards: "${js_loop_thing_to_build_list_of_child_cards_with_more_templating()}"

I don’t need examples or anything (yet). Just a simple yes/no/maybe with some hackery would suffice. Wondering if it’s worth the time installing and figuring out the necessary JS to even attempt it.


:man_shrugging:it’s pretty open-ended. Only thing to consider is that you’ll need to return a list in your case, not a single object. I haven’t played around with returning a list at all. The bug is in iterating over a list.