react-mdc-web icon indicating copy to clipboard operation
react-mdc-web copied to clipboard

TextField component doesn't know when input element has value and moves label incorrectly back into input field area

Open SgtPooki opened this issue 6 years ago • 1 comments

I feel like I should be able to use a Textfield component without having to save state and manage onclick and other values.. something like

<Textfield name="EMAIL" floatingLabel="Your email" />

and have it work properly as an input element would. However, react-mdc-web textfield components seem to require a 'value' element to be passed to recognize whether state has changed or not.

I believe this should be easily inferable from the contents of the native input element.

You seem to currently only be getting the value of the input element from props, which means you're tightly coupled to the state management and rendering tree of parent elements. As a styling sort of framework, I was expecting that you would work as a more native sort of element.

It looks like just a few tweaks to https://github.com/kradio3/react-mdc-web/blob/master/src/Textfield/Textfield.js#L48-L50 and https://github.com/kradio3/react-mdc-web/blob/master/src/Textfield/Textfield.js#L61-L74 should solve this issue for any future users...

Would you accept a pull request resolving this issue so that it still works as it does but also works as a more self-contained native component as well?

SgtPooki avatar Aug 21 '17 07:08 SgtPooki

Sure, would be great

kradio3 avatar Aug 21 '17 11:08 kradio3