Material-ui: [Docs]: class based comp demos.

[pranshuchittora]

The current Component Demo only includes source written in JS and TS, Which uses the latest feature for internal state management called react hooks.

Expected Behavior 🤔

While working on a year old project (which does not support hooks). It was a bit harder to make demos up and running.

Current Behavior 😯

No docs for class-based components.

Examples 🌈

class comp extends React.Component
{
 state = {
   open: true,
 }
..
...

}

Context 🔦

React hooks in a great feature, but it's still new and legacy codebase can't support it. As upgrading react as a dependency comes with a lot of breaking changes on the other deps. Hence few users still prefer demos in class-based comps.

[oliviertassinari]

As upgrading react as a dependency comes with a lot of breaking changes on the other deps.

@pranshuchittora Thanks for raising the concern. Material-UI v4 depends on React 16.8.0. The first version that supports hooks. If you can't upgrade to this React version, you can't use Material-UI v4. If you can't use v4, you can use v3. In v3, you will find demos using the React class API.

[pranshuchittora]

Yeah, I know that v4 works with React version which supports hooks, but as a package, we must provide docs for class-based comps. As the class is not something that has been deprecated by react. It depends on user preference.

React spring is a good example https://www.react-spring.io/docs/

[oliviertassinari]

@pranshuchittora We still support the class API. The reasoning is that new developers start with hook. Developers that already know the class API should be more experienced and be able to migrate the demos.

[mbrookes]

@pranshuchittora You should find that the majority of the v3 docs demos work with v4, and for any that don't you can follow the migration guide:

https://material-ui.com/guides/migration-v3/