Home Reference Source Repository

src/Breadcrumb.js

/**
 * @file melon/Breadcrumb
 * @author leon([email protected])
 */

import React from 'react';
import {create} from 'melon-core/classname/cxBuilder';
import Item from './breadcrumb/Item';

const cx = create('Breadcrumb');

/* eslint-disable fecs-prefer-class */
export default function Breadcrumb(props) {

    const {
        children,
        ...rest
    } = props;

    return (
        <div {...rest} className={cx(props).build()}>
            {React.Children.map(
                children,
                (child, index) => (
                    child && child.type === Item
                        ? React.cloneElement(child, {
                            key: index,
                            level: index
                        })
                        : null
                )
            )}
        </div>
    );

}
/* eslint-enable fecs-prefer-class */

Breadcrumb.Item = Item;

Breadcrumb.createCrumbs = function (crumbs) {

    return crumbs.map(function (crumb, index) {

        const {text, ...rest} = crumb;

        return (
            <Item
                {...rest}
                key={index}
                level={index}>
                {text}
            </Item>
        );
    });

};