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

9.3.0 • Public • Published

@fluentui/react-breadcrumb

React Breadcrumb components for Fluent UI React

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

167,327

Version

9.3.0

License

MIT

Unpacked Size

322 kB

Total Files

157

Last publish

Collaborators

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