> ## 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 Summary

> O bloco Summary do Aftersell Cart: totais, economias e códigos de desconto aplicados.

> O bloco **Summary** mostra ao comprador o que ele vai pagar: uma linha de total com economias opcionais, mais as tags de desconto aplicadas. Ele resume os totais e economias do carrinho logo acima do botão de checkout, para que os compradores vejam o valor final antes de confirmar.

<Frame>
  <img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/cart-summary-block-subtotal-savings-applied-discounts.png?fit=max&auto=format&n=1Y3gBpUfxv16VGSW&q=85&s=455f22040697c41fd1e02a870e9cccf8" alt="Bloco Summary exibindo subtotal, economias e descontos aplicados antes do checkout" width="1368" height="250" data-path="images/aftersell/cart-summary-block-subtotal-savings-applied-discounts.png" />
</Frame>

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

* **Os tokens de economia recolhem graciosamente.** Se uma célula referencia `{{savings}}` ou `{{pre_savings_price}}` mas o carrinho não tem economia, essa célula recorre a apenas `{{total_price}}`, então os compradores nunca veem "\$0.00 off" ou um preço riscado igual ao total. Se você combinar `{{cart_item_count}}` e `{{savings}}` na mesma célula, a contagem de itens também é removida no fallback sem economias — coloque-os em células separadas para evitar isso.
* As tags de desconto aparecem apenas quando **Show discount codes** está ativado *e* o carrinho tem descontos para listar. Isso inclui tanto descontos baseados em código quanto automáticos.

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

| Configuração            | O que controla                                                                                                | Padrão                               |
| ----------------------- | ------------------------------------------------------------------------------------------------------------- | ------------------------------------ |
| **Left text**           | A célula esquerda da linha de total. Rich text com tokens. Exemplo: `Subtotal ({{cart_item_count}} items)`.   | `Subtotal`                           |
| **Right text**          | A célula direita. Rich text com tokens (total, preço pré-economia riscado, economias, contagem de itens).     | Total com markup de economia riscado |
| **Savings format**      | Mostrar economias como um `percent` inteiro ou um valor `absolute`.                                           | `percent`                            |
| **Show discount codes** | Se as tags de desconto aplicadas aparecem. Isso inclui tanto descontos baseados em código quanto automáticos. | Ativado                              |

As células de texto suportam os tokens `{{cart_item_count}}`, `{{total_price}}`, `{{pre_savings_price}}` e `{{savings}}`.

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

* **Região:** parte inferior.
* **Máximo:** 2 por estado do carrinho — o carrinho com itens e o carrinho vazio recebem cada um sua própria cota.
* **Estado:** tanto carrinho com itens quanto vazio.
* Adicionado a novos carrinhos por padrão. Não bloqueado, então você pode removê-lo ou ocultá-lo.

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

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

| Prop                | Tipo       | Para que serve                                                                                                                           |
| ------------------- | ---------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
| `leftHtml`          | `string`   | A célula esquerda como HTML sanitizado, com tokens resolvidos.                                                                           |
| `rightHtml`         | `string`   | A célula direita como HTML sanitizado, com tokens resolvidos.                                                                            |
| `discountCodes`     | `string[]` | Títulos de desconto aplicados ao carrinho (baseados em código e automáticos). `[]` quando não há.                                        |
| `showDiscountCodes` | `boolean`  | Se o lojista quer as tags de desconto listadas **e** o carrinho tem descontos para listar.                                               |
| `hasSavings`        | `boolean`  | `true` quando o carrinho tem economia. Use para ocultar sua própria linha de economias.                                                  |
| `totalPrice`        | `string`   | Total do carrinho, já formatado.                                                                                                         |
| `preSavingsPrice`   | `string`   | Total antes das economias, já formatado.                                                                                                 |
| `savings`           | `string`   | Valor economizado. Já formatado, **ou uma porcentagem** como `15%`, dependendo da configuração de formato de economias do lojista.       |
| `itemCount`         | `number`   | Total de unidades no carrinho — quantidades das linhas visíveis somadas, excluindo a linha de proteção de envio.                         |
| `isLoading`         | `boolean`  | Sempre `false` aqui: o bloco renderiza seu skeleton nativo durante o carregamento e só chama seu template quando o carrinho está pronto. |

<Warning>
  Como `savings` pode ser dinheiro ou porcentagem, não construa sua própria frase em torno dele presumindo um dos dois. `{props.savings}` sozinho é seguro; `You saved ${props.savings}` não é.
</Warning>

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

Estilize este bloco com sua seção **Design** no painel de configurações. Essas são sobreposições por bloco que se aplicam por cima do 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).