Skip to content

BaseBoxButton

A Base Box Shaped Button

Props

Prop nameDescriptionTypeValuesDefault
renderElementAsspecify the tag of the buttonstring-'button'
boxStyleDefine type of button box style: 'large' | 'small'stringlarge, small'large'
iconspecify icon name if desired, this uses the BaseIcon component;
see BaseIcon for available icons
string-null
showPlusshow a plus sign next to the icon if true
only available for large button style
boolean-false
textspecify the text for the buttonstring-''
subtextspecify subtext for the button
only available for large button style
string-''
boxSizedefine box sizeobject-{
width: '25%'
}
boxRatiodefine the ratio of width and height of the box
(in percent string, e.g. 1:1 --> '100', 1:2 --> '50')
string-'100'
disabledset button inactiveboolean-false
showTooltipshow tooltipboolean-false

Events

Event namePropertiesDescription
clickedundefined Event - the native eventevent emitted on box click
on-tooltipundefined Event - the native event from tooltip triggeredevent emitted on tooltip click

Slots

NameDescriptionBindings
default

Example buttons with a 1:1 ratio (100%)

Example button with a 1:2 ratio (50%)