[Style] Add a withWidth HOC

[oliviertassinari]

• I have changed the stateless functionnal component organisation because of Add a failing test for sort-prop-types jsx-eslint/eslint-plugin-react#567.
• Do you think I should be writing more tests for this PR?
• I had to add one feature to the EventListener component.
• Deprecate the styleResizable mixin and remove it from the documentation. That's was our last mixin #RIP. Now, we should be able to enforce react/prefer-es6-classes.
• Remove usage of material-ui/lib from the documentation.

[oliviertassinari]

@callemall/material-ui There are unrelated topics inside this PR. If you think this chunk is too big. I can break it down.

[newoga]

@newoga I have changed the stateless functionnal component organisation because of jsx-eslint/eslint-plugin-react#567.

That's fine by me! As long as we're consistent 😄

Deprecate the styleResizable mixin and remove it from the documentation. That's was our last mixin #RIP. Now, we should be able to enforce react/prefer-es6-classes.

🎉 Finally! 🎉

[nathanmarks]

@oliviertassinari doing a PR for that right now

[newoga]

Should we put the withWidth HoC in util instead of style. Conceptually I always thought of util as our internal files and components, and style and the public util. If I'm correct thinking that way, then maybe util is a better home for it.

Thoughts?

[nathanmarks]

Tabs documentation page -- I'm getting this warning in my console now:

warning.js:44 Warning: Failed propType: Invalid prop `width` of type `string` supplied to `InkBar`, expected `number`. Check the render method of `Tabs`.

[newoga]

Now, we should be able to enforce react/prefer-es6-classes.

@oliviertassinari Should we just do that as part of this PR?

[mbrookes]

Should we put the withWidth HoC in util instead of style. Conceptually I always thought of util as our internal files and components, and style and the public util. If I'm correct thinking that way, then maybe util is a better home for it.

Yes, internal is internal components, utils internal utilities, and styles (mostly) public style / theme stuff.

[oliviertassinari]

@oliviertassinari Should we just do that as part of this PR?

Done! I have

• enforced react/prefer-es6-class
• moved withWidth HOC to the /utils folder
• Added two small test
• Split the PR into 4 distinct commits.

[newoga]

@oliviertassinari This looks good to me. Nice commits!

[mbrookes]

Nice work @oliviertassinari! 💯

[damonmaria]

@oliviertassinari: I was going to use this new component but the widths used don't match the Material Design window sizes. Is there are reason they are different?

[oliviertassinari]

@damonmaria Good question, Material-UI completely overlook the responsive aspect of the specification. In this PR, I was focusing on porting the mixin into a high order component.
We definitely need to improve this breaking points 👍.