Hi guys, would someone be able to help point me in the right direction. I am looking to create a style that uses the “Empty” element state for a text box. Based on the manual, this state should be driven when the field is clear and it does animate correctly to that state. But when i enter any text, the animation does not change - despite a base style animation.
It appears that although you can type into a textfield, it doesn’t ever actually place any child nodes to the input element. That’s why it always thinks it’s empty. You’ll probably notice the style works correctly when doing it against a text area.
Sadly there isn’t really a nice way to make it work. You could set/unset the style class using something like an expression binding if({this.props.text}!='','','emptyStyle') for the classes but it won’t switch between classes until an actual text value is committed.
In the mean time I’ll write up an internal ticket to see if we can change the textfield component to work with that element state.
1 Like