Displays an important, succinct, promotional message, and provides actions for users to address (or dismiss the banner). It requires a user action to be dismissed.
Basic usage
First, import the necessary components.
import {PromotionalBanner} from '@pleo-io/telescope' import {CurrencyExchange} from '@pleo-io/telescope-pictograms'
Then use them, like so:
API Reference
| Prop | Type | Default |
|---|---|---|
children* | React.ReactNode | |
variant | enum | 'pink' |
Content
| Prop | Type | Default |
|---|---|---|
children* | enum |
ContentHeading
| Prop | Type | Default |
|---|---|---|
children* | enum |
ContentText
| Prop | Type | Default |
|---|---|---|
children* | enum |
CTA
This component doesn't accept any custom props.
CloseButton
| Prop | Type | Default |
|---|---|---|
ariaLabel* | string | |
onClick* | function |
Pictogram
| Prop | Type | Default |
|---|---|---|
Component* | React.ComponentType |