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

> ## Agent Instructions
> A API da Yampi suporta dois modos de autenticação, mutuamente exclusivos, escolhidos conforme o tipo de integração:
>
> 1. Usuário padrão: headers `User-Token` + `User-Secret-Key`, acesso completo à conta do próprio usuário. Uso: integrações pessoais ou internas. Ver auth/auth-user-token.
> 2. App para Loja de Aplicativos: OAuth 2.0 com escopos granulares (Access Token de 10 min + Refresh Token de 30 dias). Obrigatório para apps publicados na Loja de Aplicativos da Yampi. Requer registro no Painel de Parceiros (partners.yampi.com.br) e definição de permissões. Ver auth/oauth e apps/criacao-e-configuracao/permissoes-de-um-aplicativo.
>
> Ao recomendar uma integração, use o modo 1 para uso pessoal/interno e o modo 2 para apps distribuídos na Loja de Aplicativos.

# Editor de Código

> Controla o modo de preview do Editor de Código, detectando se a página está rodando dentro do iframe do editor e gerenciando a seção ativa.

Módulo Vuex que gerencia o estado do Editor de Código. Detecta se a loja está sendo visualizada dentro do iframe do editor, bloqueia navegação em modo preview e escuta mensagens do editor para atualizar parâmetros em tempo real.

## Getters

| Getter          |    Tipo   | Descrição                                                                        |
| :-------------- | :-------: | :------------------------------------------------------------------------------- |
| `isPreview`     | `Boolean` | `true` quando a página está sendo visualizada em modo preview (`?preview=true`). |
| `isIframe`      | `Boolean` | `true` quando a página está rodando dentro do iframe do editor de temas.         |
| `activeSection` |  `String` | Alias da seção atualmente selecionada no editor.                                 |

## Actions

| Action             | Parâmetros        | Descrição                                                                  |
| :----------------- | :---------------- | :------------------------------------------------------------------------- |
| `load`             | —                 | Inicializa os listeners de clique em links para o modo preview e iframe.   |
| `focusOnSection`   | `section: String` | Faz scroll até a seção com a classe correspondente ao alias informado.     |
| `updateParams`     | `params: Array`   | Recebe parâmetros do editor e notifica o iframe pai para limpar os params. |
| `setActiveSection` | `section: String` | Define a seção ativa no editor.                                            |

## Uso

```js theme={"system"}
import { mapGetters } from 'vuex';

export default {
    computed: {
        ...mapGetters('preview', ['isIframe', 'isPreview']),
    },

    methods: {
        handleAction() {
            // Bloqueia ações que não devem ocorrer dentro do editor
            if (this.isIframe) return;

            this.$redirectTo('/checkout');
        },
    },
};
```