From 9a5b313ea12bdb9dc3e3873ca3a2639bd7483e46 Mon Sep 17 00:00:00 2001 From: Stefan Malzner Date: Mon, 28 Jan 2019 11:35:25 +0100 Subject: Update packages --- packages/ui/src/icon/index.tsx | 55 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 55 insertions(+) create mode 100644 packages/ui/src/icon/index.tsx (limited to 'packages/ui/src/icon/index.tsx') diff --git a/packages/ui/src/icon/index.tsx b/packages/ui/src/icon/index.tsx new file mode 100644 index 000000000..e30d3396d --- /dev/null +++ b/packages/ui/src/icon/index.tsx @@ -0,0 +1,55 @@ +import * as mdiIcons from '@mdi/js'; +import MdiIcon from '@mdi/react'; +import { Theme } from '@meetfranz/theme'; +import classnames from 'classnames'; +import React, { Component } from 'react'; +import injectStyle from 'react-jss'; + +import { IWithStyle } from '../typings/generic'; + +interface IProps extends IWithStyle { + icon: keyof typeof mdiIcons; + size?: number; + className?: string; +} + +const styles = (theme: Theme) => ({ + icon: { + fill: theme.colorText, + }, +}); + +class IconComponent extends Component { + public static defaultProps = { + size: 1, + }; + + render() { + const { + classes, + icon: iconName, + size, + className, + } = this.props; + + let icon = ''; + if (iconName && mdiIcons[iconName]) { + icon = mdiIcons[iconName]; + } else if (iconName && !mdiIcons[iconName]) { + console.warn(`Icon '${iconName}' was not found`); + } + + return ( + + ); + } +} + +export const Icon = injectStyle(styles)(IconComponent); -- cgit v1.2.3-70-g09d2