All files / lib/Breadcrumbs index.js

83.33% Statements 5/6
75% Branches 3/4
100% Functions 2/2
83.33% Lines 5/6
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87                                                  4x   4x 1x 1x           4x                                                                                                      
import React from 'react';
import PropTypes from 'prop-types';
 
/**
 * @category navigation
 * @component breadcrumbs
 * @variations collab-ui-react
 */
 
class Breadcrumbs extends React.PureComponent {
  static displayName = 'Breadcrumbs';
 
  static propTypes = {
    /** @prop Children nodes to render inside Breadcrumbs | null */
    children: PropTypes.node,
    /** @prop Optional css class string | '' */
    className: PropTypes.string
  };
 
  static defaultProps = {
    children: null,
    className: ''
  };
 
  render() {
    const { className, children } = this.props;
 
    const items  = React.Children.map(children, (child, idx) => {
      Eif (children.length - 1 === idx || !children.length) {
        return React.cloneElement(child, { className: 'current' });
      }
 
      return child;
    });
 
    return <ul className={'cui-breadcrumbs' + ` ${className}`}>{items}</ul>;
  }
}
 
export default Breadcrumbs;
 
/**
* @component breadcrumbs
* @section default
* @react
 
import { Breadcrumbs, ListItem } from '@collab-ui/react';
 
export default function DefaultBreadCrumbs() {
    return (
      <div className='row'>
        <div className='columns small-12'>
          <Breadcrumbs>
            <li href='javascript:void(0)'>
              Default
            </li>
          </Breadcrumbs>
        </div>
        <div className='columns small-12'>
          <Breadcrumbs>
            <li href='javascript:void(0)'>
              Default
            </li>
            <li href='javascript:void(0)'>
              Default2
            </li>
          </Breadcrumbs>
        </div>
        <div className='columns small-12'>
          <Breadcrumbs>
            <li href='javascript:void(0)'>
              Default
            </li>
            <li href='javascript:void(0)'>
              Default2
            </li>
            <li href='javascript:void(0)'>
              Default3
            </li>
          </Breadcrumbs>
        </div>
      </div>
    );
  }
 
**/