sling-web-component-button

sling-web-component-button

Install

npm install sling-web-component-button

Tag

  <sling-button></sling-button>

Dependencies

• sling-web-framework
• sling-web-helpers

Attributes and properties

Name	Type	Default Values	ReflectToAttribute	Observer	callSdk
block	Boolean	false	:heavy_check_mark:
color	String	normal	:heavy_check_mark:
disabled	Boolean	false	:heavy_check_mark:
size	String	normal	:heavy_check_mark:
Layout	String	normal	:heavy_check_mark:

Description

Name	Description
block	A boolean value that assigns the width: 100% CSS property to button.
color	A pre-configured value for styling of button, can be normal, primary, secondary, success, danger, warning, info, clear.
disabled	Disables the button, preventing the user from clicking and changing their style to dimmed
size	A pre-configured value for size of button, can be normal, small or big.
layout	A pre-configured value for the button's layout, can be normal, outline or text.

Events

• click

Description: The event is triggered when the button is clicked and passes this information to the parents.

Examples

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

Usage

<sling-button color="primary">Text</sling-button>

<sling-button block size="big" color="warning">Text</sling-button>

<sling-button color="danger">Text</sling-button>