TypeScript with React Native: Creating custom components

I created a custom component by inheriting React's Component as follows:

import React, { Component as ReactComponent, ReactElement } from "react";
import { Button as ReactButton, View } from "react-native";

interface IMyComponentProps extends React.Props<IMyComponentProps> {
  colWidth?: number;
}

class MyComponent extends ReactComponent<IMyComponentProps> {
  getProps() { //dummy function to check if subClass can access this function
    return this.props;
  }

  renderChildren() { //adding custom props to child MyComponents
    return React.Children.map(this.props.children, (child: ReactElement<any>) => {
      const isMyComponent: boolean =
        child && //sometimes child is undefined
        child.type &&
        typeof child.type !== "string" &&
        React.Component.prototype.isPrototypeOf(child.type.prototype) &&
        child.type.prototype instanceof MyComponent;

      if (isMyComponent) {
        return React.cloneElement(child, { isChild: true }); //newProps will get merged with the existing props
      } else {
        return child;
      }
    });
  }

  render() {
    return this.renderChildren();
  }
}

class Button extends MyComponent {
  render() {
    return (
      <View {...this.getProps()}>
        <ReactButton title={this.props.title} onPress={this.props.onPress} />
      </View>
    );
  }
}

I get the following error at the render method of the Button class:

Property 'render' in type 'Button' is not assignable to the same property in base type 'MyComponent'. Type '() => Element' is not assignable to type '() => ReactElement[]'. Type 'Element' is not assignable to type 'ReactElement[]'. Property 'includes' is missing in type 'Element'.

How can I fix this? Thanks