Breadcrumbs

import React from 'react';
import { Breadcrumb, BreadcrumbItem } from 'seduo-ui';

const Example = (props) => (
    <div>
        <Breadcrumb>
            <BreadcrumbItem active>Home</BreadcrumbItem>
        </Breadcrumb>
        <Breadcrumb>
            <BreadcrumbItem>
                <a href="#">Home</a>
            </BreadcrumbItem>
            <BreadcrumbItem active>Library</BreadcrumbItem>
        </Breadcrumb>
        <Breadcrumb>
            <BreadcrumbItem>
                <a href="#">Home</a>
            </BreadcrumbItem>
            <BreadcrumbItem>
                <a href="#">Library</a>
            </BreadcrumbItem>
            <BreadcrumbItem active>Data</BreadcrumbItem>
        </Breadcrumb>
    </div>
);

export default Example;

No list

Breadcrumbs can work without the usage of list markup.

import React from 'react';
import { Breadcrumb, BreadcrumbItem } from 'seduo-ui';

const Example = (props) => (
    <div>
        <Breadcrumb tag="nav">
            <BreadcrumbItem tag="a" href="#">
                Home
            </BreadcrumbItem>
            <BreadcrumbItem tag="a" href="#">
                Library
            </BreadcrumbItem>
            <BreadcrumbItem tag="a" href="#">
                Data
            </BreadcrumbItem>
            <BreadcrumbItem active tag="span">
                Bootstrap
            </BreadcrumbItem>
        </Breadcrumb>
    </div>
);

export default Example;