ebay-fake-menu

ebay-fake-menu

Demo

Storybook

Install

yarn add @ebay/ui-core-react

Usage

import { EbayFakeMenu, EbayFakeMenuItem as Item } from '@ebay/ui-core-react/ebay-fake-menu';
import '@ebay/skin/menu';
<EbayFakeMenu>
    <Item href="http://ebay.com">eBay US</Item>
    <Item href="http://ebay.de">eBay DE</Item>
    <Item href="http://ebay.co.uk">eBay UK</Item>
</EbayFakeMenu>

EbayFakeMenu Props

Name	Type	Required	Description	Data
itemMatchesUrl	Boolean	No	used in conjunction with current -- This determines whether aria-current will be page or true -- Defaults to true which gives aria-current a value of page
onKeyDown	Function	No	triggered on key down	`(KeyboardEvent
onSelect	Function	No	For using with keyboard navigation	`(KeyboardEvent

EbayFakeMenuItem Props

Name	Type	Required	Description
href	String	No	Redirection link on click
type	String	No	Set to button to render menu-item as a button instead of a link
current	Boolean	No	Whether or not the href is the current href of the page
badgeNumber	Number	No	Used as a number to be placed inside the badge
badgeAriaLabel	Number	No	Only if badgeNumber provided, passed as the aria-label directly to the badge

EbayFakeMenuSeparator

Example:

import { EbayFakeMenu, EbayFakeMenuItem as Item, EbayFakeMenuSeparator as Separator } from '@ebay/ui-core-react/ebay-fake-menu';
<EbayMenu>
    <Item>item 1</Item>
    <Item current>item 2</Item>
    <Separator />
    <Item>item 3</Item>
</EbayMenu>