Module: Button

A highly configurable button component.

Parameters:

Name Type Description

props

object

Component props.

Properties

Name	Type	Description
`active`	boolean	Whether the button is active or not.
`activeText`	string	The active text when the button is active.
`activeType`	string	The active type, currently supports `loader`.
`ariaLabel`	string	The aria-label text for the button.
`children`	JSX.Element \| null	React element children.
`circular`	boolean	Whether the button is a circular shape or not.
`customAttributes`	object	Custom attributes for the component.
`customClasses`	string \| Array \| object	Custom classes for the component.
`disabled`	boolean	Whether the button is disabled or not.
`disableWhileActive`	boolean	Whether to disable the button while active.
`icon`	string	Icon name if using an icon button.
`iconAttributes`	object	Custom attributes for the icon.
`iconPosition`	string	Icon position if using one, `leading` or `trailing`.
`iconPrefix`	string	The prefix for the icon library to be used.
`label`	string	The label for the button, or the text displayed when inactive.
`loaderProps`	object	All valid options for the loader component if loader button is active.
`lockSize`	boolean	If interactive, whether to lock the width of the button when transitioning states.
`onClick`	function	On click handler for the button.
`size`	string	Size of the button.
`spacing`	string \| number \| Array \| object	The spacing for the component, as a string, number, array, or object.
`type`	string	The button type.
`width`	string	The button width, `auto` or `full`.

ref

object | null

Ref to the component.

Since: 1.1.15
Source: elements/Button/index.js, line 16

Returns:

The button component.

Type:: JSX.Element

Example

import Button from '@gravityforms/components/react/admin/elements/Button';

return (
    <Button onClick={ () => {} } size="size-height-xl" type="white">
        { 'Click me' }
    </Button>
);