sling-web-component-snackbar

Sling Snackbar

Usage no npm install needed!

<script type="module">
  import slingWebComponentSnackbar from 'https://cdn.skypack.dev/sling-web-component-snackbar';
</script>

README

sling-web-component-snackbar

Install

npm install sling-web-component-snackbar

Tag

  <sling-snackbar></sling-snackbar>

Dependencies

  • sling-framework
  • sling-helpers

Attributes and properties

Name Type Default Values ReflectToAttribute Observer callSdk
layout String :heavy_check_mark:
aim String :heavy_check_mark:
size String :heavy_check_mark:
closeable Boolean :heavy_check_mark:

Description

Name Description
layout Sets the layout type of snackbar, currently only outline..
aim Defines the snackbar objective, can be danger, success or warning.
size Value that defines the size.
closeable Defines whether or not snackbar has the close icon.

Events

This component does not emit events.

Examples

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

Usage

<sling-snackbar closeable size="small">
  Here is a message for you.
  <sling-button slim color="light" layout="outline" size="small">Action</sling-button>
</sling-snackbar>

image

<sling-snackbar closeable size="small" aim="danger">
  Here is a message for you.
  <sling-button slim color="light" layout="outline" size="small">Action</sling-button>
</sling-snackbar>

image