Menu

The main app menu that slides in from the left when the AppHeader's menu button is clicked.

Import
import Menu from 'react-storefront/Menu'

Props

NameTypeDefaultDescription
menuobject
drawerWidthnumber330

The width of the drawer in pixels

rootHeaderelement

An element to display at the top of the root of the menu

rootFooterelement

An element to display at the bottom of the root of the menu

useExpandersbool

Set to true to use expandable menu items below depth 1

expandFirstItemboolfalse

Set to true to expand first item for not root items

openbool

Set to true to display the menu

persistentbool

Set to true to dock the menu so that it's always open and not modal

classesobjectOf

CSS classes for this component

onClosefunc

Called when the menu is closed

simpleboolfalse

Set to true to render a simple set of expanders rather than a multi-level drill down. Defaults to false.

ExpandIconfunc

The icon to use for collapsed groups

CollapseIconfunc

The icon to use for expanded groups

CSS API

You can override all the class names injected by Moov-PWA thanks to the classes property. This property accepts the following keys:

  • drawer
  • list
  • listPadding
  • header
  • icon
  • headerText
  • hbox
  • listItem
  • link
  • listItemImage
  • listItemIcon
  • expander
  • leaf
  • expanded
  • drawerFixed