@zestia/ember-messages

This Ember addon provides a component for rendering messages, which can optionally be dismissed by the user.

Additionally, messages can be flashed using the flash message service.

Installation

ember install @zestia/ember-messages

Demo

https://zestia.github.io/ember-messages

Features

Dismissible messages ✔︎
Flash message queue ✔︎
Scroll into view ✔︎

Notes

This package intentionally does not come with any styles.
It is configured with ember-test-waiters so awaiting in your test suite will just work.

Example

<Message>
  Content
</Message>

`Message`

Arguments

`@type`

Optional. Sets a data attribute on the message DOM element.

`@onDismiss`

Optional. When provided, the message becomes dismissible. This action is fired after a message has been dismissed and any animations have finished.

`FlashMessages`

This addon comes with a service for managing a queue of flash messages

Example

@inject('flash-message') flashMessageService;
// ...
this.flashMessageService.add('error', 'Something went wrong!');

They can be rendered as below. When a message is added, it will be scrolled into view.

<FlashMessages />