Gravity
Search
K

Message

Messages communicate important information to a user and are designed to stand out wherever they're placed in your UI.

Preview

Code

<Message
closable
title='Welcome to Gravity!'
text='This is a sample dashboard to get you started'
type='success'
buttonLink='/dashboard'
buttonText='Get Started'
/>

Props

Prop
Description
Required
Value
buttonLink
url link for the button
optional
string
buttonText
button label
optional
string
className
Custom styles
optional
SCSS or Tailwind style
closable
let the user hide the message
optional
boolean (default: false)
text
text label
required
string
title
title text
optional
string
type
message type
required
info, success, warning or error

Blank Slate Message

Blank slate messages are used when there is no data to display and prompts the user to take action.
<BlankSlateMessage
title='No items found'
text='Would you like to create one?'
buttonText='Create Item'
action={ this.createItem }
marginLeft='2em'
/>

Props

Prop
Description
Required
Value
action
callback executed on button click
optional
function
buttonText
button label
optional
string
marginLeft
offset the left margin
optional
string
marginTop
offset the top margin
optional
string
text
message body
required
string
title
message title
optional
string
Last modified 5mo ago