Canvas Kit Banner
Errors and Alerts notify users of missteps that happen within a workflow and describe how the user can take appropriate action to resolve them.
Installation
yarn add @workday/canvas-kit-react
or
yarn add @workday/canvas-kit-react-banner
Usage
import Banner from '@workday/canvas-kit-react-banner';
<Banner label="3 errors" />;
Static Properties
ErrorType: ErrorType
<Banner error={Banner.ErrorType.Error} label="3 errors" />
Variant: BannerVariant
<Banner variant={Banner.Variant.Sticky} label="3 errors" />
Component Props
Required
label: String
Label of the banner
Optional
onClick: (e: React.MouseEvent<HTMLButtonElement>) => void
Function called when the user click on the banner
variant: BannerVariant
Set the banner variant as
full
orsticky
Default: BannerVariant.Full
error: ErrorType
Set the banner type as
alert
orerror
Default: ErrorType.Alert
actionText: string
Set the action text in the
full
variant
Default: 'View All'