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

# SelectSku

> Gerencia a seleção de SKU via dropdowns ou botões de variação, com validação e scroll para erro.

Componente central de seleção de SKU na página do produto. Renderiza os atributos de variação (cor, tamanho, etc.) como lista de selects ou como botões. Valida a seleção e emite o SKU selecionado ao componente pai.

## Uso

```vue theme={"system"}
<SelectSku
  variations-style="buttons"
  :should-scroll-on-error="true"
  :show-error-message="true"
  @update="handleSkuUpdate"
/>
```

## Propriedades

| Propriedade           |    Tipo   | Obrigatória | Valor padrão | Descrição                                                                      |
| :-------------------- | :-------: | :---------: | :----------: | :----------------------------------------------------------------------------- |
| `variationsStyle`     |  `String` |      ❌      |   `'list'`   | Estilo de exibição das variações. Valores: `'list'` (selects) ou `'buttons'`.  |
| `shouldScrollOnError` | `Boolean` |      ❌      |    `true`    | Quando `true`, rola até o campo com erro ao tentar comprar sem selecionar SKU. |
| `showErrorMessage`    | `Boolean` |      ❌      |    `true`    | Exibe mensagem de erro abaixo do campo quando a seleção está incompleta.       |

## Eventos

| Evento            | Payload                   | Descrição                                                                      |
| :---------------- | :------------------------ | :----------------------------------------------------------------------------- |
| `update`          | `Object` (SKU) ou `null`  | Emitido quando um SKU válido é selecionado ou quando a seleção é redefinida.   |
| `updateVariation` | `{ imageUrl, productId }` | Emitido ao clicar em uma opção de variação, com a imagem e ID correspondentes. |