@fluentui/react-breadcrumb
TypeScript icon, indicating that this package has built-in type declarations

9.0.20 • Public • Published

@fluentui/react-breadcrumb

React Breadcrumb components for Fluent UI React

These are not production-ready components and should never be used in product. This space is useful for testing new components whose APIs might change before final release.

Breadcrumbs should be used as a navigational aid in your app or site. They indicate the current page's location within a hierarchy and help the user understand where they are in relation to the rest of that hierarchy.

Usage

To import React Breadcrumb components:

import {
  Breadcrumb,
  BreadcrumbItem,
  BreadcrumbButton,
  BreadcrumbDivider,
  BreadcrumbProps
} from "@fluentui/react-components';

Simple example of Breadcrumb Usage:

import { Breadcrumb, BreadcrumbItem, BreadcrumbDivider } from '@fluentui/react-breadcrumb';

export const App = () => (
  <Breadcrumb aria-label="breadcrumb">
    <BreadcrumbItem>Item 1</BreadcrumbItem>
    <BreadcrumbDivider />
    <BreadcrumbItem>Item 2</BreadcrumbItem>
    <BreadcrumbDivider />
    <BreadcrumbItem current={true}>Item 3</BreadcrumbItem>
  </Breadcrumb>
);

Specification

See the Spec.md file for background information on the design/engineering decisions of the component.

API

For information about the components, please refer to the API documentation.

Readme

Keywords

none

Package Sidebar

Install

npm i @fluentui/react-breadcrumb

Weekly Downloads

47,200

Version

9.0.20

License

MIT

Unpacked Size

222 kB

Total Files

141

Last publish

Collaborators

  • sopranopillow
  • microsoft1es
  • justslone
  • chrisdholt
  • miroslavstastny
  • levithomason
  • uifabricteam
  • uifrnbot
  • dzearing
  • layershifter
  • ling1726
  • travisspomer