Markdown

O Seed suporta Markdown nos slots de conteúdo de componentes com template. Você pode usar @markdown / @md para renderizar blocos completos de Markdown.

Onde o Markdown funciona

Conteúdo textual dentro de slots de componentes com template é renderizado como Markdown inline (negrito, itálico, código, links). Para Markdown completo (títulos, listas, blocos de código), use o componente @markdown ou @md:

```seed
@div class=prose max-w-none
  @markdown
    # Título

    Este parágrafo tem **negrito**, _itálico_ e `código inline`.

    - Item 1
    - Item 2
    - Item 3
```

Markdown suportado

O componente @markdown / @md

Renderiza filhos como Markdown completo, sem tag wrapper no output. Equivalente a @markdown:

```seed
@md
  ## Seção

  Texto com **formatação** e lista:

  1. Primeiro item
  2. Segundo item
```

Isso gera <h2>, <p> e <ol> diretamente — sem <div> envolvendo o conteúdo.

TOC, FAQ e HowTo (dialeto de artigo)

Todo conteúdo Markdown (@markdown/@md e arquivos .md) passa pelo mesmo renderer, que reconhece três marcadores opcionais em comentários HTML:

```md
# Como delegar tarefas com clareza

Intro do artigo.

<!--TOC-->

## Por que delegar é difícil

Corpo da seção...

<!--FAQ-->
# Perguntas frequentes
### Como delegar?
Com clareza e contexto.

### E se falhar?
Revise o briefing.
<!--/FAQ-->

<!--HOWTO-->
# Passo a passo
### Capture tudo
Anote cada tarefa pendente.

### Clarifique
Decida o próximo passo de cada uma.
<!--/HOWTO-->
```

Os <h2>/<h3> (inclusive os gerados dentro de FAQ/HowTo) recebem id automático via slug — usado tanto pelo TOC quanto por âncoras externas.

Markdown em slots de template

Conteúdo dentro de slots de componentes com template aceita Markdown inline automaticamente:

```seed
@card
  @title
    Título do card
  @description
    Uma descrição com **destaque** e `código`.
```

Fence de código (escaping)

Para exibir sintaxe .seed como texto (sem renderizar como componentes), use triple backtick:

```seed
@button variant=primary
  Exemplo
```

O conteúdo dentro de fence de código não é processado como componentes Seed.

Arquivos .md como páginas

Qualquer arquivo .md dentro de src/ é tratado como uma página, gerando HTML automaticamente — igual a .seed:

```
src/
├── index.seed        → dist/index.html
├── about.md          → dist/about.html
└── blog/
    ├── meu-post.md   → dist/blog/meu-post.html
    └── outro.seed    → dist/blog/outro.html
```

Front matter

Arquivos .md suportam front matter YAML entre ---, com os mesmos campos de .seed:

```markdown
---
title: Sobre Nós
description: Conheça a empresa
layout: custom
css: /static/about.css
body-class: page-about
---

# Sobre Nós

Texto em **markdown** puro.
```

Layouts

A resolução de layout funciona igual a .seed:

Coleções

Arquivos .md funcionam como itens de coleção, junto com .seed. Um blog pode ter posts em ambos os formatos:

```
src/blog/
├── post-seed.seed     (sintaxe Seed)
├── post-markdown.md   (Markdown puro)
└── list.layout
```

O front matter de cada .md define os campos acessíveis via @each (título, data, etc).

Includes com _*.md

Arquivos prefixados com _ (ex: _nota.md) não geram página própria — são tratados como includes, igual a _*.seed.

Importando Markdown — @md file=

Use @md file=caminho para importar e renderizar um arquivo .md externo dentro de um .seed:

```seed
@section class=prose max-w-none
  @md file=docs/api-reference.md

@section class=prose
  @md file=../shared/changelog.md
```

O caminho é relativo ao arquivo .seed que contém o @md. Se o .md importado tiver front matter, ele é ignorado — apenas o corpo é renderizado.

Feito com ❤️ e Seed