Alert

Alert UI Component

Installation

npm i @synerise/ds-alert
or
yarn add @synerise/ds-alert

Usage

import Alert from '@synerise/ds-alert'
<Alert
mode="background-outline"
showIcon
type="success"
message="Success!"
description="Success description"
showMoreLabel="Show more"
onShowMore={() => {}}
/>

Demo

API

PropertyDescriptionTypeDefault
afterCloseCalled when close animation is finished() => void-
closableWhether Alert can be closedboolean-
closeTextClose text to showstring\ ReactNode
descriptionAdditional content of Alertstring\ ReactNode
iconCustom icon, effective when showIcon is trueReactNode-
messageContent of Alertstring\ ReactNode
showIconWhether to show iconbooleanfalse
typeType of Alert styles, options: success, info, warning, errorstringinfo
onCloseCallback when Alert is closed(e: MouseEvent) => void-
modeWhether to render alert with outline, background, or transparent, options: background, background-outline, outline, clearstringbackground
colorSet the color that overrides the standard color of alert, options: blue, grey, green, yellow, red, pink, mars, orange, fern, cyan, purple, violetstring``

Alert.InlineAlert

PropertyDescriptionTypeDefault
typeType of InlineAlert, options: success, alert, warningstringwarning
messageMessage of alertstring \ React.ReactNode-