Button

The Button is a fundamental building block for almost every app created with Uify. It renders a clickable button that triggers a pre-configured action on click. There are various styling options to alter the look-and-feel of the button to its particular environment.

Properties

The Button component offers the following configuration properties.

Property	Type	Default value	Behavior
Disable while running	boolean	false	When set to true, the button is disabled while the on-click action is running. This prevents action executions while previous clicks have not been processed yet.
Disabled	boolean	false	Whether the button should be disabled. When disabled, the button is greyed out and does not trigger the associated on-click action when clicked.
Show loading while running	boolean	false	When set to true, the button text is replaced with a loading spinner while the associated on-click action is executing. This provides clearer visual feedback, especially for long-running actions.
Text	stringWithJs	"Submit"	The text displayed on the button.
Tooltip	stringWithJs	""	Tooltip text to display on hover over the button. If empty, no tooltip is shown.

Events

The Button has only a single event: "On click". The associated action is executed when the button is clicked by the user, assuming that it is visible and not disabled. The action is executed regardless of how much time has passed between mouse-down and mouse-up.

API

The Button exposes the following API in the JavaScript runtime environment.

Property / Function	Type	Behavior
click()	() => Promise<void>	Emulates the click on the button. This function is a noop if the button is disabled, however executes the action even if the button is not visible to the user.
disabled	boolean	Provides the current boolean value of the "Disabled" property.
setDisabled(value)	(value: boolean) => void	Sets the value of the "Disabled" property to the provided boolean value.
setValue(value)	(value: string) => void	Sets the value of the "Text" property to the provided string.
value	string	Provides the current string value of the "Text" property.