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

# Bloco Discount code

> O bloco Discount code do Aftersell Cart — permita que os compradores insiram e apliquem um código de desconto antes do checkout.

> O bloco **Discount code** é um campo onde os compradores podem inserir e aplicar um código promocional no carrinho, para que vejam o desconto refletido antes de irem para o checkout.

<Frame>
  <img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/cart-discount-code-block-input-apply.png?fit=max&auto=format&n=1Y3gBpUfxv16VGSW&q=85&s=ac5730766b756fdf99c2fc9f65ac202b" alt="Bloco Discount code com campo de entrada e botão Apply no cart drawer" width="1314" height="230" data-path="images/aftersell/cart-discount-code-block-input-apply.png" />
</Frame>

<div id="behavior">
  ## Comportamento
</div>

* Ao aplicar, o código é limpo de espaços, convertido em maiúsculas e enviado à Shopify. Como a Shopify aceita a solicitação independentemente de o código ser válido, o bloco então verifica novamente o carrinho para confirmar que o código foi realmente aplicado.
  * **Válido** → o campo é limpo e o desconto é aplicado.
  * **Inválido** → o bloco exibe "Invalid discount code."
* Como um código se acumula com outros descontos (descontos automáticos, outros códigos) é tratado inteiramente pela Shopify — o bloco apenas aplica o código.
* Os códigos aplicados são exibidos no bloco [**Summary**](/pt/aftersell/cart/summary-block), não aqui.

<div id="settings">
  ## Configurações
</div>

| Configuração    | O que controla                               | Padrão          |
| --------------- | -------------------------------------------- | --------------- |
| **Placeholder** | O texto de placeholder do campo. Traduzível. | `Discount code` |
| **Button text** | O rótulo do botão de aplicar. Traduzível.    | `Apply`         |

<div id="placement-and-limits">
  ## Posicionamento e limites
</div>

* **Região:** corpo ou parte inferior.
* **Máximo:** 1 por estado do carrinho — o carrinho cheio e o carrinho vazio têm, cada um, sua própria cota.
* **Estado:** tanto cheio quanto vazio.
* Não é adicionado por padrão. Não é bloqueado — você pode removê-lo ou ocultá-lo.

<div id="custom-template">
  ## Template personalizado
</div>

Suporta um [template personalizado](/pt/aftersell/cart/custom-templates) pela sua aba Code, que substitui a marcação nativa deste bloco pelo seu JSX. Estas são as props que ele recebe.

| Prop                   | Tipo                      | Para que serve                                                                                          |
| ---------------------- | ------------------------- | ------------------------------------------------------------------------------------------------------- |
| `discountCodeInput`    | `string`                  | Valor atual do campo.                                                                                   |
| `placeholder`          | `string`                  | Placeholder exibido no campo vazio.                                                                     |
| `buttonText`           | `string`                  | Rótulo do botão de aplicar.                                                                             |
| `isValidating`         | `boolean`                 | `true` enquanto um código enviado está sendo verificado. Desative seu controle de envio com base nisso. |
| `isInvalid`            | `boolean`                 | `true` quando o último código enviado foi rejeitado.                                                    |
| `setDiscountCodeInput` | `(value: string) => void` | Atualiza o valor do campo.                                                                              |
| `handleSubmit`         | `(event: Event) => void`  | Envia o código atual.                                                                                   |
| `isLoading`            | `boolean`                 | `true` enquanto o carrinho ainda está fazendo sua primeira busca.                                       |

<Warning>
  Conecte tanto `setDiscountCodeInput` quanto `handleSubmit`. Sem o primeiro, não é possível digitar no campo; sem o segundo, um código nunca é aplicado.
</Warning>

<div id="design">
  ## Design
</div>

Estilize este bloco pela sua seção **Design** no painel de configurações. São substituições por bloco que se sobrepõem ao seu design global e recorrem a ele quando estão em branco.

O que são configurações de design? Saiba mais aqui: [Configurações de design](/pt/aftersell/cart/design-settings).