Banner: React
Use banners to alert users about important information.
Installation
Before you can start using the @mediahuis/chameleon-react component, you’ll need to install it, for more information check: Getting started for developers.
With that done, you’re now ready to implement the component in your application.
import { Banner } from '@mediahuis/chameleon-react';
export default function Example() {
return <Banner>Example banner</Banner>;
}
Properties
| Property | Type | Default | Required | Description |
|---|---|---|---|---|
accessibilityLabelCloseButton | String | 'Close' | No | Sets the accessibility label for the close button. |
appearance | 'error' | 'info' | 'success' | 'warning' | - | No | Controls the background and text. |
children | ReactNode | - | No | The body content. |
closeHidden | Boolean | false | No | Determines whether the close button should be hidden or not. |
onClose | Function | - | No | This event is triggered when the close button is clicked. |
show | Boolean | - | No | Controls the visibility. |