AsyncButton

This is a button that is meant to be used to execute a async action. The onClick handler should return a promise. The button's behavior is to set the status as 'loading...' until the promise that was returned evluates and returns a result or throws an exception.

Installation

import { AsyncButton } from 'uxp/components';

Signature

const AsyncButton: React.FunctionComponent<AsyncButtonProps>

Examples

<AsyncButton
     title="Submit"
     onClick={async() => {return executeAction("model", "action", {})}}
     icon="https://static.iviva.com/images/Adani_UXP/QR_badge_icon.svg"
     loadingTitle="Submitting..."
     className="custom-css-class"
 />

Properties

Name	Type	Mandatory	Default Value	Example Value
title	string	No	-	-
leftIcon	ButtonIcon	No	-	-
rightIcon	ButtonIcon	No	-	-
className	string	No	-	-
onClick	() => Promise	Yes	-	-
active	boolean	No	-	-
disabled	boolean	No	-	-
loadingTitle	string	No	-	-
onError	(e: any) => void	No	-	-
styles	React.CSSProperties	No	-	-
iconStyles	React.CSSProperties	No	-	-
type	"button" | "submit" | "reset"	No	-	-
variant	'primary' | 'secondary' | 'danger'	No	-	-
iconOnly	boolean	No	-	-
icon	string	No	-	-
iconPosition	'left' | 'right'	No	-	-
useLoadingSpinner	boolean	No	-	-

Related Types

• AsyncButtonProps

• ButtonIcon

• PHIconProp

• PHIconPrefix