Sling-web-component-message NPM

sling-web-component-message

The message component is a static bar that indicates, through prevailing icons and colors, some state to the user.

Install

npm install sling-web-component-message

Tag

  <sling-message></sling-message>

Dependencies

sling-framework
sling-helpers

Attributes and properties

Name	Type	Default Values	ReflectToAttribute	Observer	callSdk
srcdata	String		:heavy_check_mark:
aim	String		:heavy_check_mark:

Description

Name	Description
srcdata	This is the message that will be shown in the component
aim	Defines the message objective, can be `danger`, `success` or `warning`.

Events

This component have no event.

Examples

All component examples can be emulated using the npm start sling-web-component-message command.

Use

<sling-message aim="error"></sling-message>
<sling-message aim="success"></sling-message>
<sling-message aim="alert"></sling-message>
<sling-message aim="standby"></sling-message>
<script>
  srcdata = ['Some message.', 'Some other message.'];
  const components = Array.from(document.querySelectorAll('sling-message'));
  components.map(component => component.srcdata = srcdata);
</script>