@itwin/itwinui-react/esm/core/Header/HeaderBreadcrumbs.js

A react component library for iTwinUI

import * as React from 'react';
import cx from 'classnames';
import { SvgChevronRight, Box } from '../../utils/index.js';
export const HeaderBreadcrumbs = React.forwardRef((props, forwardedRef) => {
  let { className, items, ...rest } = props;
  return React.createElement(
    Box,
    {
      as: 'nav',
      'aria-label': 'breadcrumbs',
      className: cx('iui-breadcrumbs', 'iui-header-breadcrumbs', className),
      ref: forwardedRef,
      ...rest,
    },
    React.createElement(
      Box,
      {
        as: 'ol',
        className: cx('iui-breadcrumbs-list', 'iui-header-breadcrumbs-list'),
      },
      items.reduce(
        (previous, current, index) => [
          ...previous,
          current,
          index !== items.length - 1 &&
            React.createElement(
              Box,
              {
                as: 'li',
                className: 'iui-breadcrumbs-separator',
                key: index,
              },
              React.createElement(SvgChevronRight, {
                key: `chevron${index}`,
                'aria-hidden': true,
                className: 'iui-chevron',
              }),
            ),
        ],
        [],
      ),
    ),
  );
});
if ('development' === process.env.NODE_ENV)
  HeaderBreadcrumbs.displayName = 'HeaderBreadcrumbs';