Carrossel de Opções
Recurso disponível apenas no canal Widget
{
"default": {
"type": "carousel",
"payload": {
"pick": "Escolha uma opção abaixo",
"options": [
{
"image": "https://image.com/img.jpg",
"title": "Meu titulo 1",
"description": "Descrição do item 1. <br> Essa descrição pode ser longa e conter html",
"btnLabel": "Selecionar",
"label": "label1",
"value": "option1"
},
{
"image": "https://image.com/img.jpg",
"title": "Meu titulo 2",
"description": "Descrição do item 2. <br> Essa descrição pode ser longa e conter html",
"btnLabel": "Selecionar",
"label": "label2",
"value": "option2"
},
{
"image": "https://image.com/img.jpg",
"title": "Meu titulo 3",
"description": "Descrição do item 3. <br> Essa descrição pode ser longa e conter html",
"btnLabel": "Selecionar",
"label": "label3",
"value": "option3"
}
],
"hideArrows": true|false,
"showTextInput": true|false
}
}
}
- type: carousel
- payload:
- pick: mensagem que será exibido no cabeçalho do carrossel de opções.
- options: itens que comporão o carrossel.
- image (opcional): URL da imagem a ser destacada.
- title (opcional): título do item.
- description (opcional): texto descritivo do item, pode ser longa e conter HTML.
- btnLabel (default: "Selecionar"): label do botão para escolher o item.
- label: texto que entrará como mensagem do usuário após a escolha do item. O carrossel "some" e a mensagem, referente ao item escolhido, é exibida como mensagem de texto.
- value: valor que será enviado ao Zenvia NLU ao escolher a opção. Pode ser utilizado em um direcionamento de fluxo.
- cognitive (default: true): determina se a mensagem será enviada para curadoria ou não.
- hideArrows (default: false): se passado o valor true, esconde as setas de scroll para esquerda e direita.
- error_message (default: Por favor, selecione uma opção da lista): mensagem de erro para quando o nó for obrigatório e o input não for válido.
A validação do
input
que é passado para o builder possui um valor boolean (true ou false). {
"valid": true|false
}
É possível fazer várias combinações com os atributos opcionais
image
, title
e description
. Isso garante uma visível personalização do componente, adequando a sua necessidade. Segue as possíveis combinações:- imagem, título e descrição;
- imagem e título;
- imagem e descrição;
- título e descrição;-
- apenas imagem, título ou descrição.
Exemplo
Preview no Widget
Workspace
{
"default": {
"type": "carousel",
"payload": {
"pick": "Qual a forma de pagamento você prefere??",
"options": [
{
"image": "https://source.unsplash.com/random",
"title": "Cartão de crédito",
"description": "Você pode: <ul><li>Fazer compras pela internet parceladas.</li><li>Obter um prazo a mais para pagar a compra.</li></ul>",
"label": "Pagamento com Cartão de Crédito",
"value": "credito"
},
{
"image": "https://source.unsplash.com/random",
"title": "Boleto",
"btnLabel": "Eu quero!!",
"label": "Pagamento com Boleto",
"value": "boleto"
},
{
"image": "https://source.unsplash.com/random",
"description": "Uma vantagem do <b>pagamento em espécie</b> é ser conveniente em pequenas compras, já que a maioria dos estabelecimentos não aceita cartões nesse caso.",
"label": "Pagamento em espécie",
"value": "espécie"
},
{
"description": "Não tenho interesse em realizar essa compra nesse momento.",
"label": "Nenhuma forma de pagamento escolhida",
"value": "nenhum",
"cognitive": false
},
{
"title": "Debito",
"description": "Nas compras com cartão de débito não incorrem encargos.<br><br>Você pode trocar pontos por prêmios, milhas, bônus, descontos e muito mais.",
"label": "Pagamento com Cartão de Débito",
"value": "debito"
}
]
}
}
}

Envie uma flag para indicar que a mensagem recebida naquele nó não deve ser enviada para a curadoria.
Exemplo 1
Exemplo 2
{
"default": {
"type": "select",
"payload": {
"pick": "pergunta",
"options": [
{
"title": "opção 1",
"value": "valor da opção 1"
},
{
"title": "opção 2",
"value": "valor da opção 2"
},
{
"title": "opção 3",
"value": "valor da opção 3"
}
],
“skip_curatorship”: true
}
}
}
{
"default": {
"type": "select",
"payload": {
"pick": "pergunta",
"options": [
{
"title": "opção 1",
"value": "valor da opção 1",
“skip_curatorship”: true
},
{
"title": "opção 2",
"value": "valor da opção 2",
“skip_curatorship”: true
},
{
"title": "opção 3",
"value": "valor da opção 3"
}
]
}
}
}
- Quando for setado true, a mensagem irá bater no cognitivo, mas a mensagem não será enviada para a área de curadoria.
- Por default o seu valor é false.
- Ele pode ser ativado para todas as opções do componente (exemplo 1) ou somente para uma opção em específica (exemplo 2).
Last modified 10mo ago