📝 Bloco de Pergunta Dissertativa no PayloadCMS
O PerguntaDissertativa é um bloco criado para armazenar perguntas em formato dissertativo dentro do PayloadCMS. Ele utiliza um editor de texto rico baseado no Lexical, permitindo formatação avançada no enunciado da pergunta.
🚀 Estrutura do Bloco
A estrutura do bloco segue o formato padrão do PayloadCMS, contendo:
slug
: Define um identificador único do bloco.labels
: Nomes no singular e plural para exibição no painel administrativo.fields
: Lista os campos que compõem o bloco, incluindo o enunciado da pergunta.
import { Block } from 'payload'
import {
lexicalEditor,
FixedToolbarFeature,
InlineToolbarFeature,
} from '@payloadcms/richtext-lexical'
🔹 Aqui importamos os módulos necessários:
Block
: Representa a estrutura de um bloco no PayloadCMS.lexicalEditor
: Editor de texto baseado no Lexical.FixedToolbarFeature
: Adiciona uma barra de ferramentas fixa ao editor.InlineToolbarFeature
: Adiciona uma barra de ferramentas flutuante para edição inline.
🏗️ Definição do Bloco
const PerguntaDissertativa: Block = {
slug: 'PerguntaDissertativa', // 🏷️ Identificador do bloco
labels: {
singular: 'Pergunta Dissertativa',
plural: 'Perguntas Dissertativas',
},
🔹 O slug
define o identificador do bloco, que será usado internamente pelo PayloadCMS.
🔹 Os rótulos (labels
) especificam os nomes para exibição no painel.
📌 Campo da Pergunta
fields: [
{
name: 'pergunta',
label: 'Enunciado da Pergunta Dissertativa', // 📝 Texto da pergunta
type: 'richText',
editor: lexicalEditor({
features: ({ defaultFeatures }) => {
return [...defaultFeatures, FixedToolbarFeature(), InlineToolbarFeature()]
},
}),
required: true,
},
],
}
🔹 name: 'pergunta'
→ Define o identificador do campo.
🔹 label: 'Enunciado da Pergunta Dissertativa'
→ Nome que aparecerá no painel administrativo.
🔹 type: 'richText'
→ Permite o uso do editor de texto avançado.
🔹 editor: lexicalEditor({...})
→ Configura o editor com recursos extras.
🔹 required: true
→ Torna o campo obrigatório.
🔥 Conclusão
Esse bloco é ideal para sistemas de provas, quizzes e formulários onde perguntas dissertativas são necessárias. Ele permite o uso de formatação avançada, tornando a experiência mais interativa.
📜 Código Completo
import { Block } from 'payload'
import {
lexicalEditor,
FixedToolbarFeature,
InlineToolbarFeature,
} from '@payloadcms/richtext-lexical'
const PerguntaDissertativa: Block = {
slug: 'PerguntaDissertativa',
labels: {
singular: 'Pergunta Dissertativa',
plural: 'Perguntas Dissertativas',
},
fields: [
{
name: 'pergunta',
label: 'Enunciado da Pergunta Dissertativa',
type: 'richText',
editor: lexicalEditor({
features: ({ defaultFeatures }) => {
return [...defaultFeatures, FixedToolbarFeature(), InlineToolbarFeature()]
},
}),
required: true,
},
],
}
export default PerguntaDissertativa