I am using Typescript and Material-UI I want to declare the component type for a variable like this

import MoreVert from '@material-ui/icons/MoreVert'

import { SvgIconProps } from '@material-ui/core/SvgIcon';



let myIcon: SvgIconProps = <MoreVert />; // does not work

But I am getting the error:

[ts]

Type 'Element' is not assignable to type 'SvgIconProps'.

  Types of property 'type' are incompatible.

    Type 'string | ComponentClass<any> | StatelessComponent<any>' is not assignable to type 'string'.

      Type 'ComponentClass<any>' is not assignable to type 'string'.

This is how the SvgIcon.ts looks like. What am I doing wrong?

import * as React from 'react';

import { StandardProps, PropTypes } from '..';



export interface SvgIconProps

  extends StandardProps<React.SVGProps<SVGSVGElement>, SvgIconClassKey> {

  color?: PropTypes.Color | 'action' | 'disabled' | 'error';

  component?: React.ReactType<SvgIconProps>;

  fontSize?: 'inherit' | 'default' | 'small' | 'large';

  nativeColor?: string;

  titleAccess?: string;

  viewBox?: string;

}



export type SvgIconClassKey =

  | 'root'

  | 'colorSecondary'

  | 'colorAction'

  | 'colorDisabled'

  | 'colorError'

  | 'colorPrimary'

  | 'fontSizeInherit'

  | 'fontSizeSmall'

  | 'fontSizeLarge';



declare const SvgIcon: React.ComponentType<SvgIconProps>;



export default SvgIcon;