sling-web-component-message

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>