EbayFakeMenu
Storybook
yarn add @ebay/ui-core-react
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>