notification

Version Compatibility
notification was introduced in version 4.23.0 of the JourneyApps Container.
The notification UI component displays a message in a top-level bar to the user. It automatically fades out after a few seconds. notification needs to be triggered from JavaScript/TypeScript.
Example
main.js
notification.success("Your changes were saved successfully");
Notification types
Type
Note
Color
success
​
Positive
error
​
Negative
info
​
Info
show
Generic type. Introduced in version 4.27 of the JourneyApps Container
Info (default)
Options
Version Compatibility
notification supports options since version 4.27 of the JourneyApps Container.
​
Examples:
var options = {
    timeout: 5 * 1000 // Display the notification for 5 seconds
};
​
notification.success("Your changes were saved successfully.", options);
var options = {
    color: '#C0FFEE',
    timeout: null
};
​
notification.show("The job was submitted successfully", options);
notification supports an options object as a second parameter with the following valid keys:
Key
Description
Example
color
Background color of the notification. Can either be:
a hex value
a named color
Defaults to: info
color: "#C0FFEE"
or
color: "positive"
textColor
The color the notification's text. Can either be:

hex value
a named color

Note that if textColor is omitted, it will resolve itself with the following rules:
If the specified color is a named color, textColor is automatically set to that named color's text counterpart (e.g. primary_text for primary).
If the specified color is a hex value, textColor is automatically set to #333333 (dark) or #FFFFFF (light), whichever has the greatest contrast with the background color.
textColor: "#333333"
or
textColor: "positive-text"
timeout
The time (in milliseconds) before the notification disappears.
Note: For no timeout (i.e. the notification displays until the user taps it or clicks on it), set timeout to null.
Defaults to:
3000 (3 seconds) if no buttons are present
null if buttons are present
timeout: 5000
or
timeout: null
buttons
See section below
​
Buttons
notification supports buttons in the notification bar.
A button is an object with the following structure:
{
    label: "Button label here",
    onPress: function() {
        // Callback to execute when button is pressed
    }
}
To add buttons to the notification, add one or an array of the above object to the buttons property of the options object.
Examples:
2 buttons:
var options = {
  buttons: [{
    label: "Later",
    onPress: function() {
      // Dismiss the notification
    }
  }, {
    label: "View",
    onPress: function() {
      // Go to "View"
    }
  }]
};
​
notification.info("You have received a new message", options);
1 button:
var options = {
    color: 'primary',
    buttons: [{
        label: "View",
        onPress: function() {
        // Go to "View"
        }
    }]
};
​
notification.show("You have received a new message", options);

Type	Note	Color
`success`		Positive
`error`		Negative
`info`		Info
`show`	Generic type. Introduced in version 4.27 of the JourneyApps Container	Info (default)

Key	Description	Example
`color`	Background color of the notification. Can either be: a hex value a named color Defaults to: `info`	`color: "#C0FFEE"` or `color: "positive"`
`textColor`	The color the notification's text. Can either be: hex value a named color Note that if `textColor` is omitted, it will resolve itself with the following rules: If the specified `color` is a named color, `textColor` is automatically set to that named color's text counterpart (e.g. `primary_text` for `primary`). If the specified `color` is a hex value, `textColor` is automatically set to `#333333` (dark) or `#FFFFFF` (light), whichever has the greatest contrast with the background color.	`textColor: "#333333"` or `textColor: "positive-text"`
`timeout`	The time (in milliseconds) before the notification disappears. Note: For no timeout (i.e. the notification displays until the user taps it or clicks on it), set `timeout` to `null`. Defaults to: `3000` (3 seconds) if no buttons are present `null` if buttons are present	`timeout: 5000` or `timeout: null`
`buttons`	See section below

navigation FAQs

object-dropdown

Last modified 10d ago

notification

Example

Notification types

Options

​

Buttons

Examples: