Hello everyone,
there are awesome cards out there like @thomasloven 's auto-entities & card-mod or @iantrich 's config-template-card, and @romrider 's apexcharts-card`. That is to name but a few of many 
Each of these cards adds one important part to Home Assistant that is missing from stock. And that is the point of such an open, community oriented and based system
Anyway, I have found that in 99% of my cards I need auto-entities, card-mod and I need config-template-card.
Unfortunately, I have yet to figure out how to make them work in a multi-level approach.
I am trying to feed entities with wildcard (from auto-entities) into a stock or custom card that does not support wildcards. At the same time I am trying to feed Javascript to the same card.
Problem: only one top-layer card seems to work. So either I use c-t-c or auto-e.
And since c-t-c does not support wildcards, I thought that maybe auto-e can supply also c-t-c. Again, seems to fail.
So approach would be
- auto-entities supplies wildcard entitiy list to config-template-card AND to apexcharts-card
- config-template-card supplies Javascript capability and entity monitoring to apexcharts-card (monitoring of the entities supplied by auto-entities.
So in a way, auto-entities would need to work like card-mod (which is not a card) and is always available, not just within the one layer below it.
Can anybody think of a way to make this work?
My starting point:
type: custom:auto-entities
filter:
include:
- input_datetime.* # entities needed by config-template-card AND apexcharts-card
- sensor.xiaomi_humidity* # entities needed by apexcharts-card
options: # options needed by apexcharts-card
name: >-
${
states['sensor.xiaomi_humidity_dining_room'].attributes.friendly_name.replace("Xiaomi
Humidity", "") }
yaxis_id: first
stroke_width: 2
group_by:
func: raw
type: line
opacity: 1
curve: smooth
fill_raw: last
show:
extremas: true
datalabels: false
card:
type: custom:config-template-card # needed to add Javascript to apexcharts-card
card:
type: custom:apexcharts-card # basic apexcharts-card using the input of the two above
card_mod:
style: |
ha-card {
--ha-card-background: rgba(0, 0, 0, 0);
--ha-card-box-shadow: none;
--primary-text-color: white;
--secondary-text-color: white;
}
graph_span: >-
${
((states['input_datetime.end_datetime'].attributes.timestamp-states['input_datetime.start_datetime'].attributes.timestamp)/60/60).toFixed(2)+'h'
}
span:
offset: >-
${
(-(states['sensor.timestamp'].state-states['input_datetime.end_datetime'].attributes.timestamp)/60/60).toFixed(2)+'h'
}
yaxis:
- id: first
show: true
- id: second
show: true
decimals: 2
header:
title: Xiaomi Humidity
show: true
show_states: true
colorize_states: true
apex_config:
legend:
show: false