Lógica: @if, @each e variáveis

O Seed oferece três mecanismos programáticos que funcionam em tempo de build: substituição de variáveis {chave}, condicionais @if/@else-if/@else, e iteração @each. Nenhum deles gera JavaScript — tudo é resolvido antes de o HTML ser escrito.

Variáveis de template: {chave}

Qualquer valor definido no front matter pode ser inserido em qualquer ponto do arquivo .seed usando {chave}:

```seed
---
title: Sobre nós
author: Ana Silva
cidade: São Paulo
---

@h1
  {title}

@p
  Por {author}, em {cidade}.
```

A substituição funciona dentro de texto e dentro de valores de props:

```seed
---
hero-image: /static/img/hero.jpg
cta-url: /contato
---

@img src={hero-image}, alt=Imagem principal

@button href={cta-url}, variant=primary
  Fale conosco
```

Comportamento quando a chave não existe

Se {chave} não for encontrada no front matter, o texto permanece literal no HTML — sem erro, sem output vazio:

```seed
---
title: Minha Página
---

@p
  Autor: {author}
```

Resultado: <p>Autor: {author}</p> — o placeholder aparece intacto, o que facilita depuração.

Campos de lista

Quando o campo é uma lista YAML, ele é concatenado com vírgulas:

```seed
---
tags: [seed, tutorial, html]
---

@p
  Tags: {tags}
```

Resultado: <p>Tags: seed, tutorial, html</p>

Condicionais: @if, @else-if, @else

Condicionais permitem mostrar ou ocultar blocos dependendo de um valor do front matter. Elas são resolvidas em tempo de build — o HTML gerado contém apenas o bloco que passou.

Sintaxe

```seed
@if {campo}
  // renderizado se {campo} não for vazio, zero ou "false"
@else-if {outro-campo}
  // renderizado se {campo} falhou e {outro-campo} for verdadeiro
@else
  // renderizado se nenhum bloco anterior passou
```

Como a condição é avaliada

O Seed avalia o valor da variável após substituição:

Exemplo: botão opcional

Uma seção CTA que só aparece se cta-url estiver definido no front matter:

```seed
---
title: Sobre nós
cta-url: /contato
cta-label: Fale conosco
---

@section
  @h1
    {title}

  @if {cta-url}
    @button href={cta-url}, variant=primary
      {cta-label}
```

Exemplo: navegação de paginação

O padrão mais comum — mostrar links de anterior/próximo apenas quando existem:

```seed
@nav class=flex justify-between mt-8
  @if {prev_url}
    @a href={prev_url}
      ← Anterior
  @else
    @span

  @span class=text-gray-500
    Página {page} de {total_pages}

  @if {next_url}
    @a href={next_url}
      Próximo →
  @else
    @span
```

Exemplo: três estados

```seed
---
status: active
---

@if {status}
  @if {status}
    @badge variant=success
      Ativo
@else-if {status}
  @badge variant=warning
    Pendente
@else
  @badge variant=neutral
    Inativo
```

Iteração: @each

@each repete um bloco de template para cada item de uma coleção registrada. É o mecanismo que liga o sistema de coleções ao template.

Sintaxe

```seed
@each nome-da-colecao
  // bloco repetido para cada item
  // {prefixo-campo} acessa os campos do item
```

Prefixo de variáveis

Dentro de @each, cada campo do item é acessado via {prefixo-campo}. O prefixo é derivado do nome da coleção — retirando o s final se houver:

Exemplo completo

```seed
@div class=grid gap-6 md:grid-cols-3
  @each team
    @div class=text-center p-6 rounded-xl border
      @img src={team-photo}, class=w-20 h-20 rounded-full mx-auto mb-4
      @h3 class=font-semibold text-gray-900
        {team-name}
      @p class=text-sm text-gray-500
        {team-role}
      @a href={team-linkedin}, class=text-teal-600 text-sm
        LinkedIn
```

Campos internos não são expostos

Campos cujo nome começa com _ (como _file) são internos ao Seed e não ficam disponíveis como {prefixo-campo} no template.

Coleção vazia ou não registrada

Se a coleção tiver zero itens, @each não gera nenhum HTML — sem erro, sem output. Se a coleção não foi registrada (nome errado ou não declarada no seed.yaml), o Seed exibe um bloco de erro inline visível na página para facilitar depuração.

Variáveis de página: @@nome

Além das variáveis de front matter, o Seed tem um segundo tipo de variável: blocos de componentes definidos e reutilizados dentro da mesma página com @@nome. Elas são úteis para evitar repetir um bloco em vários lugares de uma mesma página.

```seed
@@exemplo-card
  @card variant=elevated
    @title
      Título
    @body
      Conteúdo do card.

// Usa o bloco duas vezes
@section
  @@exemplo-card

@aside
  @@exemplo-card
```

Para a documentação completa de @@variáveis, incluindo o uso especial dentro de @pre, veja Variáveis de Página.

Resumo comparativo

Feito com ❤️ e Seed