Is there a way to pass a list of entities to an entity card?

Configuration Frontend
1

I have a button in my UI that pops up an entity card so I can toggle multiple related entities. I’m also using the custom:decluttering-card to make the card and browser-mod to make the entity card popup.
Here’s the coding I’m using:

# card to show various (on/off) modes
  mode-thing:
    card:
      type: custom:button-card
      entity: '[[thing_entity]]'
      name: '[[thing_name]]'
      triggers_update: all
      aspect_ratio: '[[aspect_ratio]]'
      hold_action:
        action: fire-dom-event
        browser_mod:
          command: call-service
          service: browser_mod.popup
          service_data:
            deviceID: this
            title: Modes
            hide_header: false
            card:
              type: entities
              entities:
                - entity: '[[thing_entity]]'
                - entity: '[[m1_entity]]'
                - entity: '[[m2_entity]]'
      styles:
        card:
          - background-color: '[[card_background_color]]'
          - border-radius: 0%
          - padding: 1%
          - color: ivory
          - font-size: 12px
          - text-transform: capitalize
        grid:
          - grid-template-areas: '"n n n n n" "i i m1 m1 m1" "i i m2 m2 m2" "stat stat m3 m3 m3"'
          - grid-template-columns: 1fr 1fr 1fr 1fr 1fr
          - grid-template-rows: 1fr 1fr 1fr 1fr
        name:
          - font-weight: bold
          - font-size: 13px
          - color: white
          - align-self: middle
          - justify-self: start
          - padding-bottom: 0px
        img_cell:
          - justify-content: start
          - align-items: start
          - margin: 0%
        icon:
          - color: '[[thing_icon_color]]'
          - width: 80%
          - margin-top: 0%
        custom_fields:
          stat:
            - font-size: 12px
            - align-self: middle
            - justify-self: start
          m1:
            - align-self: middle
            - justify-self: start
          m2:
            - align-self: middle
            - justify-self: start
          m3:
            - align-self: middle
            - justify-self: start
      state:
        - value: 'on'
          id: value_on
          icon: '[[thing_icon_on]]'
        - value: 'off'
          id: value_off
          icon: '[[thing_icon_off]]'
      custom_fields:
        stat: |
          [[[
            var status = '[[thing_name_off]]';
            if (entity.state == "on") status = '[[thing_name_on]]';
            return `<span>${status}</span>`
          ]]]
        m1: |
          [[[
            if ('[[m1_show]]' == 'true') {
              var icon = '[[m1_icon_off]]';
              var status = '[[m1_status_off]]';
              if (states['[[m1_entity]]'].state == '[[m1_on_state]]') {
                icon = '[[m1_icon_on]]';
                status = '[[m1_status_on]]';
              }
              return `<ha-icon icon=${icon}
              style="width: 14px; height: 14px; color: yellow;">
              </ha-icon><span> ${status}</span>`
            }
            return ``
          ]]]
        m2: |
          [[[
            if ('[[m2_show]]' == 'true') {
              var icon = '[[m2_icon_off]]';
              var status = '[[m2_status_off]]';
              if (states['[[m2_entity]]'].state == '[[m2_on_state]]') {
                icon = '[[m2_icon_on]]';
                status = '[[m2_status_on]]';
              }
              return `<ha-icon icon=${icon}
              style="width: 14px; height: 14px; color: yellow;">
              </ha-icon><span> ${status}</span>`
            }
            return ``
          ]]]
        m3: |
          [[[
            if ('[[m3_show]]' == 'true') {
              var icon = '[[m3_icon_off]]';
              var status = '[[m3_status_off]]';
              if (states['[[m3_entity]]'].state == '[[m3_on_state]]') {
                icon = '[[m3_icon_on]]';
                status = '[[m3_status_on]]';
              }
              return `<ha-icon icon=${icon}
              style="width: 14px; height: 14px; color: yellow;">
              </ha-icon><span> ${status}</span>`
           }
            return ``
          ]]]

My question is about this part right here:

            card:
              type: entities
              entities:
                - entity: '[[thing_entity]]'
                - entity: '[[m1_entity]]'
                - entity: '[[m2_entity]]'

Is there some way to “pass in” the list of entities that make up the entity card? That way I could have different instances of this card with a different number of entities on the entity card. Alternatively, is there some sort of “blank entity” that would just show up as a blank line on the entity card?

2

Since you’re using the custom button card at the top level, perhaps you could use configuration templates and variables for this: GitHub - custom-cards/button-card: ❇️ Lovelace button-card for home assistant

3

Yes. I should have mentioned that I also want a variable number of entities. I can already code for any given count, but not for 3 in some cases and 2 in others. I could, of course, make two templates, but I’d prefer to do it with one.

4

Have you had a look at “Auto-entities” custom card. Maybe that would work for this use case.

GitHub - thomasloven/lovelace-auto-entities: :small_blue_diamond:Automatically populate the entities-list of lovelace cards

5

Thanks. I’ll take a look.
I ended up using template-entity-row but it always helps having another arrow in the coding quiver.