Is it still possible somehow to use the custom element in YAML mode in version 4, or do I have to downgrade to version 3?
You can always edit dashboard components manually in YAML mode, if you switch the edit mode to code mode, or do I misunderstand your question?
My whole UI is in YAML. When I click on “Edit dashboard” I get this message:
In YAML mode I simply get the message, that the custom component doesn’t exists:
That’s the issue I want to solve.
I think that your problem is not because the 4.x version of the Custom Tile Features plugin, at least because in my case there are no such problems…
Check this screencast:
2 Likes
I have a top down/bottom up window shade, with two separate entities to control top and bottom. I’ve been on the hunt for a card where I can have two independent sliders to be able to control both sides of the cover in a single tile. I don’t see this as a current option with this project, so just curious if this is something that could be feasibly done?
You should still be able to edit this and any custom or built in card in YAML, but I haven’t seen that edit UI not available error before. I was having issues with getting my projects to work on my old dev iPhone and wonder if it’s related to me raising the TypeScript JS target version. I’m going to try lowering it down to ES5 or ES6.
Edit: it didn’t work. I have no idea why 3.3.8 works on old devices but 4.0.0 does not. It’s not due to the configuration UI as the issue also affects my other project Android TV Card.
I don’t know if it helps but I’m seeing the same issue as gerliczky, but only on FireFox… Chrome appears as expected.
Are you guys on older devices or older versions of the browser? Are there any errors in the browser developer tools console? I’m having trouble figuring out how to fix this as I only have an iPhone SE that’s not working, but my older and newer Android and desktop devices are working.
Is the option of hide / conditional custom-card not available anymore after the update?
It’s deprecated. You can use the CSS styles codeboxes at the row or individual feature level to set display: none using a template.
:host {
{% if is_state("light.sunroom_ceiling", "off") %}
display: none;
{% endif %}
}
1 Like
@gerliczky @Didgeridrew can you guys try 4.0.3? I finally figured out what was causing the custom element doesn’t exist error on my old dev iPhone. Hopefully it should fix it for y’all as well.
I tried it and now it works. Also in iPhone 12 in recent Chrome version and also on the recent desktop version of Chrome.
But the solution for me was to use the right URL in my yaml configuration as suggested on the HACS page:
1 Like
New fix for this issue of making the slider look and behave like the original tile cover slider with the latest version:
styles: |-
:host {
direction: rtl;
--tooltip-transform: translate(calc(var(--thumb-offset) * -1), -35px);
1 Like
@gerliczky finally I could upload my screencast for my previous post, so check what I get on the UI for your corresponding goal:
1 Like
Thanks a lot Tamás!
2 Likes
You should be able to create a separate custom slider feature for each entity easily.
Yeah I was more so thinking something sort of similar to a thermostat, where you have 2 separate sliders on a single track. I figured I could create two entirely separate slider features.
When I try the spin box with flex-flow, the words don’t fit. How can I fix that? There is only a limited square space for the icon and label which side, how can I increase that space, if makes sense. Thank you!
styles: |-
:host {
flex-flow: row;
}
It looks like I forgot to add width: fit-content; to the spinbox buttons when they’re using custom actions. You can add it for now and I’ll have to fix that in a patch.
:host {
flex-flow: row;
width: fit-content;
}
Edit: Spinbox custom button styles fixed in 4.0.4 (hope you don’t have trouble finding it).
1 Like
Can anyone help explain why my spinbox for setting climate temp doesn’t set the temp up or down?
I have tested doing a service call for climate.set_temperature with climate.kotatsu_heater and it works just fine.
I also have no errors from custom tile features in console.
My current code (basically lifted from the recent github release notes):
features:
- type: custom:service-call
entries:
- type: spinbox
entity_id: climate.kotatsu_heater
range:
- '20'
- '45'
tap_action:
service: climate.set_temperature
data:
entity_id: climate.kotatsu_heater
temperature: '{{ VALUE }}'
step: 1
hold_action:
action: repeat
icon: mdi:thermometer
label: '{{ VALUE }}{{ UNIT }}'
debounceTime: 1000
value_from_hass_delay: 5000
value_attribute: temperature
unit_of_measurement: °C
styles: |-
:host {
--background: var(--tile-color);
--icon-color: var(--tile-color);
flex-flow: row;
}
haptics: true
I also tried the version of code from the main github readme which instead contained this more generic tap-action YAML that doesn’t seem as correct (didn’t work ofc):
tap_action:
action: call-service
target:
entity_id: climate.kotatsu_heater