sling-web-component-button
v1.12.5
Published
Sling Button
Downloads
139
Readme
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>