> ## Documentation Index
> Fetch the complete documentation index at: https://docs.yampi.com.br/llms.txt
> Use this file to discover all available pages before exploring further.

# FloatingButton

> Botão de compra flutuante fixo na parte inferior da tela em mobile, com preço e estado de loading.

Exibe um botão de compra fixo no rodapé da tela em dispositivos móveis. Mostra o preço atual do produto e permite adicionar ao carrinho ou acionar notificação de estoque quando indisponível.

## Uso

```vue theme={"system"}
<FloatingButton
  :quantity="quantity"
  :loading-button="isLoading"
  :disabled="!canBuy"
  :price="price"
  @click="addToCart"
  @open-stock-notifications-modal="openModal"
/>
```

## Propriedades

| Propriedade     |    Tipo   | Obrigatória | Valor padrão | Descrição                                                               |
| :-------------- | :-------: | :---------: | :----------: | :---------------------------------------------------------------------- |
| `price`         |  `Object` |      ✅      |       —      | Objeto com dados de preço do produto (promocional, parcelamento, etc.). |
| `loadingButton` | `Boolean` |      ✅      |       —      | Quando `true`, exibe spinner no botão e bloqueia novos cliques.         |
| `quantity`      |  `Number` |      ❌      |      `1`     | Quantidade atual do produto selecionada pelo usuário.                   |
| `disabled`      | `Boolean` |      ❌      |    `false`   | Desabilita o botão de compra.                                           |

## Eventos

| Evento                           | Descrição                                                             |
| :------------------------------- | :-------------------------------------------------------------------- |
| `click`                          | Disparado ao clicar no botão de compra.                               |
| `open-stock-notifications-modal` | Disparado ao clicar em "Avise-me" quando o produto está indisponível. |