@berlitz/alert-banner
v5.1.11
Published
AlertBanner component for the Max Design System
Downloads
5,525
Readme
Alert Banner ![npm version](https://img.shields.io/npm/v/@berlitz/alert-banner.svg)
Display a banner fixed at the bottom of the page, containing content and a button.
Installation
yarn add @berlitz/alert-banner
Props
| Argument | Type | Required | Default | Example |
| ----------------- | ------ | -------- | ------- | ------------------------------------------------------------- |
| content | string | true | null | I have read and agree to the <a href='#'>Privacy Policy</a>
|
| buttonText | string | true | null | I Agree
|
| handleButtonClick | func | true | null | () => setBannerDismissed(true)
|
Usage
import React, { setState } from 'react'
import ComponentName from '@berlitz/alert-banner'
const MyApp = () => {
const [bannerDismissed, setBannerDismissed] = setState(false)
return (
<>
{!bannerDismissed && (
<AlertBanner
content="I have read and agree to the <a href='#'>Privacy Policy</a>"
buttonText="I Agree"
onClick={() => setBannerDismissed(true)}
/>
)}
</>
)
}
When to use this component
- Privacy policy banner
- Displaying a persistent, message to the user