Button Component

Button

Group	Prop	Description
Sizes	mini	Sizing options intended to modify font-size and padding
	tiny
	small
	medium
	large
	big
	huge
Variants	primary	Styling options to convey button type
	secondary
	info
	warning
	danger
	success
	outline
Proportion	full-height (non-themable)	Occupy 100% of parent height
	full-width (non-themable)	Occupy 100% of parent width
Events	onClick	callback function for onclick event
	standalone=({key='', value=''})
Disabled	disabled	disable button

Expected behaviours in progressive enhancements

• In order to make buttons actionable without javascript available, the default button type is submit unless set to others explicitly.

HTML

• it submits the form data when being used in a form along with other input components.
• it also supports standalone option to invoke any backend action; if this option is enabled, it will wrap the button with a form element and a hidden input element to include the key and the value of the key, which can be passed onto the backend to use.

HTML + CSS

• it applies the theme styles; no additional functional enhancement.

HTML + CSS + JS

• it support onClick event to add extra logic before submitting the form or communicate backend API.
• In case of submitting form data via API on onClick event the form component is responsible for cancelling the default behaviour.