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

# Dados da vitrine

> Como o tema lê produtos, coleções, carrinho e contexto de página pelo Theme SDK.

No tema, dados da loja entram só pelo **Theme SDK** (`@corvex/theme-sdk`). Você não chama rotas HTTP da plataforma no JSX.

```text theme={"theme":{"light":"github-light","dark":"github-dark"}}
@corvex/theme-sdk (usePage, useCorvexCart, storefront.*)
        ↓
Seção / bloco / snippet do tema
```

## Regra de ouro

> Use apenas o Theme SDK documentado aqui e em [SDK](https://docs-loja.usecorvex.com.br/sdk/overview.md).

O desenvolvedor de tema **não** precisa de:

* Acesso ao backend interno da Corvex
* Rotas administrativas
* Credenciais de backoffice
* Conhecimento de banco ou infraestrutura

`usePage` devolve o contexto inteiro da página. O argumento (`'product'`, `'collection'`) tipa a leitura; o host já sabe qual recurso renderizar.

```js theme={"theme":{"light":"github-light","dark":"github-dark"}}
import {
  createStorefront,
  usePage,
  defineSection,
  defineSectionData,
} from '@corvex/theme-sdk';
```

## Três categorias de dados

| Categoria | Quando usar | Exemplo |
| - | - | - |
| **Contexto de página** | A plataforma já sabe qual recurso renderizar | `usePage('product')` em `/products/camiseta` |
| **Consulta** | A seção precisa buscar dados extras | `storefront.products.list()` na home |
| **Referência do lojista** | Valor escolhido no editor (picker) | Field `product_list` → UUIDs em `settings` |

## API do cliente

```js theme={"theme":{"light":"github-light","dark":"github-dark"}}
const products = await storefront.products.list({
  first: 8,
  sortBy: 'BEST_SELLING',
});
```

Na vitrine, prefira hooks (`usePage`, `useStorefront`, `useCorvexCart`) em seções React. Lista completa de namespaces: [Theme SDK](https://docs-loja.usecorvex.com.br/sdk/overview.md).

`storefront.query()` (GraphQL) está reservado para versões futuras. Use a API high-level hoje.

## Por recurso

* [Product](https://docs-loja.usecorvex.com.br/data/resources/product.md) · [Coleção](https://docs-loja.usecorvex.com.br/data/resources/category.md) · [Cart](https://docs-loja.usecorvex.com.br/data/resources/cart.md)
* [products.list](https://docs-loja.usecorvex.com.br/data/queries/products-list.md) · [Reviews](https://docs-loja.usecorvex.com.br/data/queries/reviews-list.md) · [Leads](https://docs-loja.usecorvex.com.br/data/actions/leads-capture.md)
* [Recommendations](https://docs-loja.usecorvex.com.br/data/queries/recommendations-list.md)
* [Menus e Blog](https://docs-loja.usecorvex.com.br/data/menus-blog.md)

## Versão da API

```js theme={"theme":{"light":"github-light","dark":"github-dark"}}
import { STOREFRONT_API_VERSION } from '@corvex/theme-sdk';
// '2026-08'
```

Veja [Versionamento](https://docs-loja.usecorvex.com.br/data/api-versioning.md).

## Próximos passos

* [Erros comuns](https://docs-loja.usecorvex.com.br/data/pitfalls.md) — leia antes de gerar código de tema
* [Contexto de página](https://docs-loja.usecorvex.com.br/data/page-context.md)
* [Regras de escopo](https://docs-loja.usecorvex.com.br/data/scope-rules.md)
* [Mapa de dados](https://docs-loja.usecorvex.com.br/data/scope-data-map.md)
* [Theme SDK](https://docs-loja.usecorvex.com.br/sdk/overview.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.