react-toolbox/components/navigation/Navigation.js

56 lines
1.5 KiB
JavaScript
Raw Normal View History

2016-05-29 22:56:10 +03:00
import React, { PropTypes } from 'react';
2016-05-22 22:39:40 +03:00
import classnames from 'classnames';
import { themr } from 'react-css-themr';
2016-05-29 22:56:10 +03:00
import { NAVIGATION } from '../identifiers.js';
import InjectButton from '../button/Button.js';
import InjectLink from '../link/Link.js';
2016-05-29 22:56:10 +03:00
const factory = (Button, Link) => {
const Navigation = ({ actions, children, className, routes, theme, type }) => {
const _className = classnames(theme[type], className);
const buttons = actions.map((action, index) => {
return <Button className={theme.button} key={index} {...action} />;
});
2016-05-29 22:56:10 +03:00
const links = routes.map((route, index) => {
return <Link className={theme.link} key={index} {...route} />;
});
2016-05-29 22:56:10 +03:00
return (
<nav data-react-toolbox='navigation' className={_className}>
{links}
{buttons}
{children}
</nav>
);
};
2016-05-29 22:56:10 +03:00
Navigation.propTypes = {
actions: PropTypes.array,
children: PropTypes.node,
className: PropTypes.string,
routes: PropTypes.array,
theme: PropTypes.shape({
button: PropTypes.string,
horizontal: PropTypes.string,
link: PropTypes.string,
vertical: PropTypes.string
2016-05-29 22:56:10 +03:00
}),
type: PropTypes.oneOf(['vertical', 'horizontal'])
};
Navigation.defaultProps = {
actions: [],
className: '',
type: 'horizontal',
routes: []
};
2016-05-29 22:56:10 +03:00
return Navigation;
};
2016-05-29 22:56:10 +03:00
const Navigation = factory(InjectButton, InjectLink);
export default themr(NAVIGATION)(Navigation);
export { factory as navigationFactory };
export { Navigation };