kradio3 / react-mdc-web

Material Design Components for React
https://kradio3.github.io/react-mdc-web/
MIT License
173 stars 25 forks source link

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

Open SgtPooki opened 7 years ago

SgtPooki commented 7 years ago

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?

kradio3 commented 7 years ago

Sure, would be great