@justeat/f-breadcrumbs

4.4.0 • Public • Published

f-breadcrumbs

Fozzie Bear

Provides clickable paths back to previous pages


npm version CircleCI Coverage Status Known Vulnerabilities

Usage

  1. Install the module using NPM or Yarn:

    yarn add @justeat/f-breadcrumbs
    npm install @justeat/f-breadcrumbs
  2. Import the component

    You can import it in your Vue SFC like this (please note that styles have to be imported separately):

    import BreadCrumbs from '@justeat/f-breadcrumbs';
    import '@justeat/f-breadcrumbs/dist/f-breadcrumbs.css';
    
    export default {
        components: {
            BreadCrumbs
        }
    }
    

    If you are using Webpack, you can import the component dynamically to separate the bread-crumbs bundle from the main bundle.client.js:

    import '@justeat/f-breadcrumbs/dist/f-breadcrumbs.css';
    
    export default {
        components: {
            ...
            BreadCrumbs: () => import(/* webpackChunkName: "bread-crumbs" */ '@justeat/f-breadcrumbs')
        }
    }
    
    

Configuration

Props

The props that can be defined are as follows:

Prop Type Default Description
links Array - object - Defines a list of links to be rendered by f-breadcrumbs
hasBackground Boolean false Defines if the breadcrumbs component will have a background or not

Examples

The prop Links, from the above table follows the structure below, more examples can be found within the components test directory.

[{
    name: 'Link 1',
    url: '/link/1',
    routerLink: false
},
{
    name: 'Link 2',
    url: '',
    routerLink: false
}];

Development

It is recommended to run the following commands at the root of the monorepo in order to install dependencies and allow you to view components in isolation via Storybook.

# cd ./fozzie-components
yarn install

## Testing
Unit / Integration / Contract

```bash
# Run Unit / Integration / Contract tests for all components
cd ./fozzie-components
yarn test

OR

# Run Unit / Integration / Contract tests for f-breadcrumbs
cd ./fozzie-components/packages/f-breadcrumbs
yarn test

Component Tests

# Run Component tests for all components
# Note: Ensure Storybook is not running when running the following commands
cd ./fozzie-components

yarn storybook:build
yarn storybook:serve-static
yarn test-component:chrome

OR

# Run Component tests for f-breadcrumbs
# Note: Ensure Storybook is not running when running the following commands
cd ./fozzie-components/packages/f-breadcrumbs
yarn test-component:chrome

Documentation to be completed once module is in stable state.

Readme

Keywords

Package Sidebar

Install

npm i @justeat/f-breadcrumbs

Weekly Downloads

0

Version

4.4.0

License

Apache-2.0

Unpacked Size

139 kB

Total Files

13

Last publish

Collaborators

  • ilia.chikmarev
  • fidel.montesino
  • anastasiia.horban
  • raouf.sawehli
  • mmakwe-onyeka
  • gregory.palaci
  • arielfdr
  • dawidchar
  • roberto.santana
  • lizzie.turney
  • davidpn.11
  • dandel10n
  • mwh1989
  • kevinrodrigues
  • fozzie-bot
  • ashleynolan
  • simonsje
  • xander-marjoram
  • sergii.semenkiv
  • thomaswilliammcclean
  • benrwhite
  • robertellison
  • zlatin.ivanov
  • joshuang2332
  • oliversweb
  • andymayje
  • jamieomaguire
  • adammorr
  • lsphillips