{{=« »=}}
import * as React from 'react';
import { pascal } from 'naming-style';
import { addPropertyControls, ControlType } from 'framer';
// tslint:disable-next-line: ban-ts-ignore
// @ts-ignore
import * as Icons from '@material-ui/icons';

interface Props {
«& tsInterface»
}

const defaultProps: Props =  {
«& defaultProps»
};

export const «componentName»: React.SFC<Props> = (props: Props) => {
  const { height, icon: iconProp, theme, width, ...other } = props;
  const iconName = `${iconProp && pascal(iconProp)}${theme === 'Filled' ? '' : theme}`;
  // tslint:disable-next-line: ban-ts-ignore
  // @ts-ignore
  const Icon = Object.keys(Icons).includes(iconName) ? Icons[iconName] : undefined;

  return Icon ? <Icon style={{ width, height}} {...other} /> : null;
};

«componentName».defaultProps = defaultProps;

addPropertyControls(«componentName», {
«& propertyControls»
});