Appsemble 0.12.3
Getting Started
Guide
Architecture
Blocks
Action buttonButton listIntroductionActionsParametersEventsImagesData loaderDetail viewerFeedFilterFormListMapMarkdownStatsTable
Development
Deployment
Reference

Button List

Introduction

A list of buttons that can each have their own custom click handler.

It can be used on any page that requires multiple interactive buttons next to each other. Most of the modifiers supported by Bulma’s buttons are supported and can be combined.

Actions

ActionRequiredDescription
onClickfalseAction that gets dispatched when a button is clicked that doesn’t specify its own click action.
[any key]falseA custom action that gets dispatched when a button is clicked that has the same click action specified as the name of this action.

Parameters

ParameterDefaultDescription
buttons[]The list of buttons.
buttons[].onClickonClickThe name of the action to trigger when the button is clicked.
buttons[].labelThe label to render on the button.
buttons[].iconA Font Awesome icon name to render on the button
buttons[].sizenormalThe default size of the button. Supported sizes are: small, normal, medium, large
buttons[].colorThe Bulma colors applied to the button. Supported options are: primary, link, info, success, warning, danger, dark, white.
buttons.lightfalseWhether or not the light Bulma colors should be used.
buttons[].roundedfalseWhether the button should be rounded.
buttons[].fullwidthfalseWhether the button should be full width.
buttons[].invertedfalseWhether the inverted color scheme should be used.
buttons[].outlinedfalseWhether the color scheme should be applied to the button itself, or the outlines.

Events

Listen Events

EventDescription
dataThe event that is triggered when data is received. This data can be used with remap to display labels dynamically based on the received data.

Images

Action button screenshot