Loading buttons

Estos botones funcionan igual que los botones clásicos, pero ademas poseen la propiedad loading que hará que dentro del botón se muestre un loader, para indicar que una operación se esta ejecutando en el fondo.

Loading Primary Button

Loading Danger Button

Loading Success Button

Utilización

import {
LoadingPrimaryButton,
LoadingSuccessButton,
LoadingDangerButton
} from "firefly-components/loading-buttons";

<LoadingPrimaryButton loading={true} />

<LoadingDangerButton loading={true} />

<LoadingSuccessButton loading={true} />

Props

`content`	Es el contenido del botón. Puede recibir strings u otros componentes de React. También puedes poner contenido dentro del botón con la prop `children`.
`leftIcon`	Permite colocar un icono a la izquierda del contenido especificado a través de `content`.
`rightIcon`	Permite colocar un icono a la derecha del contenido especificado a través de `content`.
`handleClick`	Recibe una función que sera ejecutada cuando se haga clic en el botón.
`disabled`	Permite habilitar o deshabilitar el botón. Recibe un valor booleano. Si no se especifica, su valor por defecto es `false`.
`width`	Permite cambiar la propiedad `width` del botón. Esta propiedad se comporta igual que la propiedad `width` de CSS. Si no se especifica, su valor por defecto es `fit-content`.
`margin`	Permite cambiar la propiedad `margin` del botón. Esta propiedad se comporta igual que la propiedad `margin` de CSS. Si no se especifica, su valor por defecto es `0`.
`type`	Permite cambiar la propiedad `type` del botón. Si no se especifica, su valor por defecto es `button`.
`active`	Permite cambiar el estado `active` del botón. Recibe un valor booleano. Si no se especifica, su valor por defecto es `false`. Esta propiedad solo tiene efecto en los siguientes botones: Text Button Transparent Button Secondary Button Outline Button
`padding`	Permite cambiar la propiedad `padding` del botón. Esta propiedad se comporta igual que la propiedad `padding` de CSS. Si no se especifica, su valor por defecto es `0 1rem`.
`loading`	Recibe un valor booleano que permite poner el botón en modo `loading` lo que mostrará un Loader dentro del botón para indicar que una operación se esta ejecutando en el fondo.

Ejemplos

Loading Primary Button	`<LoadingPrimaryButton width='9rem' loading={true} />`
Loading Danger Button	`<LoadingDangerButton width="9rem" loading={true} />`
Loading Success Button	`<LoadingSuccessButton width="9rem" loading={true} />`