UNPKG

1.53 kBJavaScriptView Raw
1import React from 'react';
2import PropTypes from 'prop-types';
3import { Breadcrumb, BreadcrumbItem } from 'reactstrap';
4
5const Breadcrumbs = ({ crumbs, active, emptyState, children, linkTag: LinkTag, homeUrl, ...rest }) => {
6 const renderBreadCrumb = (crumb) => {
7 // default breadcrumbitem render
8 let breadCrumbItemChildren = <span>{emptyState}</span>;
9 // render static links
10 if (crumb.name && crumb.url) {
11 breadCrumbItemChildren = (
12 <LinkTag aria-label={crumb.name} href={crumb.url}>
13 {crumb.name}
14 </LinkTag>
15 );
16 }
17 return <BreadcrumbItem key={crumb.name + crumb.url}>{breadCrumbItemChildren}</BreadcrumbItem>;
18 };
19
20 return (
21 <Breadcrumb {...rest}>
22 <BreadcrumbItem>
23 <LinkTag aria-label="Home" href={homeUrl}>
24 Home
25 </LinkTag>
26 </BreadcrumbItem>
27 {crumbs && crumbs.length > 0 && crumbs.map((crumb) => renderBreadCrumb(crumb))}
28 {children}
29 <BreadcrumbItem active>{active || emptyState}</BreadcrumbItem>
30 </Breadcrumb>
31 );
32};
33
34Breadcrumbs.propTypes = {
35 crumbs: PropTypes.arrayOf(
36 PropTypes.shape({
37 name: PropTypes.string,
38 url: PropTypes.string,
39 })
40 ),
41 linkTag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
42 active: PropTypes.string.isRequired,
43 emptyState: PropTypes.string,
44 children: PropTypes.node,
45 homeUrl: PropTypes.string,
46};
47
48Breadcrumbs.defaultProps = {
49 emptyState: '…',
50 homeUrl: '/public/apps/dashboard',
51 linkTag: 'a',
52};
53
54export default Breadcrumbs;