2017-04-17 17:14:17 +03:00
|
|
|
import React from 'react';
|
|
|
|
import PropTypes from 'prop-types';
|
2016-05-22 19:18:47 +03:00
|
|
|
import classnames from 'classnames';
|
|
|
|
import { themr } from 'react-css-themr';
|
2017-01-26 20:05:32 +03:00
|
|
|
import { LINK } from '../identifiers';
|
|
|
|
import { FontIcon } from '../font_icon/FontIcon';
|
2015-09-19 19:20:11 +03:00
|
|
|
|
2017-01-26 20:05:32 +03:00
|
|
|
const Link = ({ active, children, className, count, icon, label, theme, ...others }) => {
|
2016-05-22 19:18:47 +03:00
|
|
|
const _className = classnames(theme.link, {
|
2017-01-26 20:05:32 +03:00
|
|
|
[theme.active]: active,
|
2016-05-22 19:18:47 +03:00
|
|
|
}, className);
|
2015-12-11 20:53:37 +03:00
|
|
|
|
2015-10-20 08:40:51 +03:00
|
|
|
return (
|
2017-01-26 20:05:32 +03:00
|
|
|
<a data-react-toolbox="link" className={_className} {...others}>
|
2016-05-22 19:18:47 +03:00
|
|
|
{icon ? <FontIcon className={theme.icon} value={icon} /> : null}
|
|
|
|
{label ? <abbr>{label}</abbr> : null}
|
2017-01-26 20:05:32 +03:00
|
|
|
{count && parseInt(count, 10) !== 0 ? <small>{count}</small> : null}
|
2016-05-22 19:18:47 +03:00
|
|
|
{children}
|
2015-10-20 08:40:51 +03:00
|
|
|
</a>
|
|
|
|
);
|
|
|
|
};
|
2015-09-19 19:20:11 +03:00
|
|
|
|
2015-10-20 08:40:51 +03:00
|
|
|
Link.propTypes = {
|
2016-05-29 21:03:41 +03:00
|
|
|
active: PropTypes.bool,
|
|
|
|
children: PropTypes.node,
|
|
|
|
className: PropTypes.string,
|
|
|
|
count: PropTypes.number,
|
|
|
|
icon: PropTypes.oneOfType([
|
|
|
|
PropTypes.string,
|
2017-01-26 20:05:32 +03:00
|
|
|
PropTypes.element,
|
2016-04-07 04:24:31 +03:00
|
|
|
]),
|
2016-05-29 21:03:41 +03:00
|
|
|
label: PropTypes.string,
|
|
|
|
theme: PropTypes.shape({
|
2016-06-04 00:44:33 +03:00
|
|
|
active: PropTypes.string,
|
|
|
|
icon: PropTypes.string,
|
2017-01-26 20:05:32 +03:00
|
|
|
link: PropTypes.string,
|
|
|
|
}),
|
2015-10-20 08:40:51 +03:00
|
|
|
};
|
2015-09-19 19:20:11 +03:00
|
|
|
|
2015-10-20 08:40:51 +03:00
|
|
|
Link.defaultProps = {
|
2015-12-11 20:53:37 +03:00
|
|
|
active: false,
|
2017-01-26 20:05:32 +03:00
|
|
|
className: '',
|
2015-10-20 08:40:51 +03:00
|
|
|
};
|
2015-11-01 11:14:36 +03:00
|
|
|
|
2016-05-29 21:03:41 +03:00
|
|
|
export default themr(LINK)(Link);
|
|
|
|
export { Link };
|