That would not be a good choice as react says you should not focus inheritance rather focus on containment or composition.
React has a powerful composition model, and we recommend using composition instead of inheritance to reuse code between components.
and
At Facebook, we use React in thousands of components, and we haven't found any use cases where we would recommend creating component inheritance hierarchies.
Props and composition give you all the flexibility you need to customize a component's look and behavior in an explicit and safe way. Remember that components may accept arbitrary props, including primitive values, React elements, or functions.
Please Visit this link to learn more.
You can create separate classes for each of the components or elements and combine them in one class like this:
import Button from './Button'
import Radio from './Radio'
import TextInput from './TextInput'
class HtmlComponent{
// note: we don't need to extend it from React.Component
// we will some function to render them.
renderTextInput() { <TextInput /> }
renderRadio() { <Radio /> }
}
// you can now use below code:
const hC = new HtmlComponent();
hC.renderTextInput();
Note Again this is not a nice idea to do but you can achieve your goal.
