ebay-icon-button

EbayIconButton

This is a circular button with an icon only.

Demo

Storybook

Usage

Import JS

import { EbayIconButton } from '@ebay/ui-core-react/ebay-icon-button'

Import following styles from SKIN

import "@ebay/skin/icon"
import "@ebay/skin/icon-button"

Or import styles using SCSS/CSS

import '@ebay/skin/icon.css'
import '@ebay/skin/icon-button.css'

Icon button

<EbayIconButton icon="settings" aria-label="settings" />

with badge:

<EbayIconButton icon="menu" badgeNumber={1} badgeAriaLabel="new feature available" />

Attributes

Name	Type	Stateful	Required	Description	Data
icon	String	No	Yes	icon name
href	String	No	No	for link that looks like a button
bageNumber	Number	No	No	number on the badge
bageAriaLabel	String	No	No	aria label of the badge
transparent	Boolean	No	No	for transparent background
size	String	No	No	alternative size for the icon button, 'large' or 'small'

Callbacks

Name	Type	Required	Description	Data
onClick	Function	No	triggered on click	(MouseEvent)
onEscape	Function	No	triggered on Esc key press	(KeyboardEvent)
onFocus	Function	No	triggered on keyboard focus	(FocusEvent)
onBlur	Function	No	triggered on focus lost	(FocusEvent)