Etapa 6: 7 tipos de bloco + PageRenderer público (SSR-safe) com sanitização sintática para rich_text.
Um editor agnóstico de tema, plugável em qualquer app do ecossistema Uttara.
Este é um bloco usando TipTap. Arraste pelo punho à esquerda para reordenar.
Plugue o editor na sua app, monte seu registry e renderize do jeito que preferir.
Documentaçãohtml_content — útil para embeds de terceiros (formulários RD Station, scripts de chat, etc).Mesma estrutura, sem chrome de edição. Este é o componente que a rota pública (ex: /quem-somos) usaria.
Um editor agnóstico de tema, plugável em qualquer app do ecossistema Uttara.
Este é um bloco usando TipTap. Arraste pelo punho à esquerda para reordenar.
Plugue o editor na sua app, monte seu registry e renderize do jeito que preferir.
Documentaçãohtml_content — útil para embeds de terceiros (formulários RD Station, scripts de chat, etc).[
{
"id": "seed-hero",
"blockType": "hero",
"sortOrder": 0,
"visible": true,
"contentJson": {
"heading": "Construa páginas em blocos",
"subheading": "Um editor agnóstico de tema, plugável em qualquer app do ecossistema Uttara.",
"imageUrl": "https://images.unsplash.com/photo-1487058792275-0ad4aaf24ca7?auto=format&fit=crop&w=1600&q=70"
}
},
{
"id": "seed-rt",
"blockType": "rich_text",
"sortOrder": 1,
"visible": true,
"contentJson": {
"html": "<h2>Bloco rich_text</h2><p>Este é um bloco usando <strong>TipTap</strong>. Arraste pelo punho à esquerda para reordenar.</p>"
}
},
{
"id": "seed-grid",
"blockType": "image_grid",
"sortOrder": 2,
"visible": true,
"contentJson": {
"displayMode": "grid",
"columns": 3,
"images": [
{
"id": "g1",
"url": "https://images.unsplash.com/photo-1518770660439-4636190af475?auto=format&fit=crop&w=600&q=70",
"alt": "Circuito"
},
{
"id": "g2",
"url": "https://images.unsplash.com/photo-1461749280684-dccba630e2f6?auto=format&fit=crop&w=600&q=70",
"alt": "Código em monitor"
},
{
"id": "g3",
"url": "https://images.unsplash.com/photo-1486312338219-ce68d2c6f44d?auto=format&fit=crop&w=600&q=70",
"alt": "MacBook"
}
]
}
},
{
"id": "seed-acc",
"blockType": "accordion",
"sortOrder": 3,
"visible": true,
"contentJson": {
"multiple": false,
"items": [
{
"id": "a1",
"title": "O que é o uttara-page-builder?",
"content": "Um construtor de páginas em blocos, agnóstico de tema, plugável em qualquer app do ecossistema."
},
{
"id": "a2",
"title": "Como adiciono novos tipos de bloco?",
"content": "Implemente uma BlockDefinition (schema, defaults, Edit, Preview) e registre via createBlockRegistry."
},
{
"id": "a3",
"title": "Posso plugar conteúdo de módulos do sistema?",
"content": "No momento o accordion só suporta itens digitados aqui. Suporte a fontes externas voltará quando o desenho de materialização estiver pronto."
}
]
}
},
{
"id": "seed-video",
"blockType": "video_embed",
"sortOrder": 4,
"visible": true,
"contentJson": {
"url": "https://www.youtube.com/watch?v=dQw4w9WgXcQ",
"title": "Vídeo de exemplo (YouTube)",
"aspectRatio": "16:9"
}
},
{
"id": "seed-cta",
"blockType": "cta",
"sortOrder": 5,
"visible": true,
"contentJson": {
"heading": "Pronto para começar?",
"description": "Plugue o editor na sua app, monte seu registry e renderize do jeito que preferir.",
"buttonText": "Documentação",
"buttonUrl": "https://github.com/uttara-dev"
}
},
{
"id": "seed-html",
"blockType": "html_content",
"sortOrder": 6,
"visible": true,
"contentJson": {
"html": "<div style=\"padding:1rem;border:1px dashed currentColor;border-radius:0.5rem;font-size:0.875rem;opacity:0.8\">Bloco <code>html_content</code> — útil para embeds de terceiros (formulários RD Station, scripts de chat, etc).</div>"
}
}
]