bpk-component-breadcrumb-css

bpk-component-breadcrumb

Backpack breadcrumb component.

Installation

npm install bpk-component-breadcrumb --save-dev

Usage

import React, { Component } from 'react';
import BpkBreadcrumb, { BpkBreadcrumbItem } from 'bpk-component-breadcrumb';


export default class App extends Component {
  render() {
    return (
      <BpkBreadcrumb label="breadcrumb">
        <BpkBreadcrumbItem href="/">Home</BpkBreadcrumbItem>
        <BpkBreadcrumbItem href="/page-1">Page 1</BpkBreadcrumbItem>
        <BpkBreadcrumbItem active>
          Page 2
        </BpkBreadcrumbItem>
      </BpkBreadcrumb>
    );
  }
}

Structured Data

JSON-LD schema mark up can be used to add structured data to the component to improve the SEO of the component through the schemaMetaData property.

Props

BpkBreadcrumb

Property	PropType	Required	Default Value
children	node	true	-
label	string	true	-
schemaMetaData	array({url: string, label: string})	false	null

BpkBreadcrumbItem

Property	PropType	Required	Default Value
children	node	true	-
href	string	false	null
active	bool	false	false
linkProps	object	false	null