LogoLogo
Zenvia Docs
  • Zenvia NLU
  • Boas Práticas
    • Eventos
      • Dicas para criar eventos
      • Eventos Personalizados
        • menu_principal
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de Eventos
        • Autosservico
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de eventos
        • sucess_no_friccion
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de Eventos
        • horario_atendimento
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de eventos
        • transbordo
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de eventos
        • pesquisa_satisfacao
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de eventos
        • conseguiu_ajudar
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de eventos
        • nivel_confianca
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de eventos
        • chamada_api
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de Eventos
        • falha_api
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de Eventos
        • primeiro_acesso
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de Eventos
        • encerramento
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de Eventos
        • estouro_tentativas_else
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de Eventos
        • intents
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de Eventos
        • rechamada
          • Dashboard
          • Fluxograma
          • Builder
          • Lista de Eventos
    • Gestão de NLU
      • Dicas de gestão de NLU
    • Personalizar widget
  • Monitor
    • Dashboard
      • Métricas e indicadores
      • Gráficos
    • Atendimentos
    • Eventos
    • Volumetria
    • Issues
    • Monitoramento de APIs
    • Métricas de avaliação
  • Build
    • Assistentes
      • Edição do Assistente
      • Builder
        • Configurações do nó
        • Componentes
          • Output
            • Texto
            • Texto randômico
            • Texto sequencial
            • Base de conhecimento
            • LivePerson - Conteúdo Estruturado
            • Arquivo
          • Input
            • Pergunta aberta
            • Autocomplete
            • Data
            • Feedback NPS
            • Feedback Custom
            • Lista inline
            • Lista modal
            • Quick Replies
            • Upload de arquivo
            • Upload de arquivo LP
            • Carrossel de Opções
            • Desambiguação
          • Fluxo de Inatividade
          • Variáveis
          • Ações
            • HTTP Request
            • Satisfaction
            • Validar celular
            • Validar CEP
            • Validar CPF
            • Validar CPF/CNPJ
            • Validar CNPJ
            • Validar nome completo
            • Validar e-mail
            • Procurar atendimento
            • Transferência entre skills Liveperson
            • Setar contexto LivePerson
            • Encerrar Atendimento LivePerson
            • Encerrar chat
            • Socket Event
            • Facebook Profile
            • Facebook Transbordo
            • Workplace Profile
            • Iniciar LiveChat
            • Functions
            • Setar NLU
            • Transferência entre assistentes
            • Contact Return
            • Intent Feedback
          • Eventos
    • Functions
    • Atributos
  • CONNECT
    • APIs
      • Agent connector API
      • Outbound
        • Outbound WhatsApp
        • Outbound Zenvia
        • Outbound Wavy
        • Outbound LivePerson
        • Outbound Infobip
        • Outbound RCS
      • Eventos
      • Atendimentos
      • LGPD
    • Canais
      • Capabilities
      • Instagram
      • Google Business Messages
      • Bot API
      • Facebook
        • Integração Messenger via Zenvia NLU
        • Integração Messenger via Liveperson
      • Google RCS
      • Microsoft Teams
      • Whatsapp
        • Zenvia
        • Blip
        • Wavy
        • Infobip
        • Liveperson
      • Widget
      • Workplace
    • Telegram
    • Contingência
    • LiveChat
      • Transbordo ALTU Connector API
        • Transbordo Tech4Humans
      • Transbordo LivePerson
      • Transbordo Zendesk Ticket
      • Transbordo Zendesk Chat
      • Transbordo Salesforce
  • TRAIN
    • Primeiros passos
    • Visão Geral
    • Configuração do NLU
    • Avaliação de Mensagens
    • Análise e ajustes
  • Mais
    • Release
      • Controle de Versão
      • 27/10/2021
      • 06/10/2021
      • 22/09/2021
      • 09/09/2021
      • 11/08/2021
      • 28/07/2021
      • 14/07/2021
      • 30/06/2021
      • 16/06/2021
      • 01/06/2021
      • 18/05/2021
      • 04/05/2021
      • 20/04/2021
      • 06/04/2021
      • 23/03/2021
      • 09/03/2021
      • 23/02/2021
      • 09/02/2021
      • 26/01/2021
      • 12/01/2021
      • 22/12/2020
      • 08/12/2020
      • 24/11/2020
      • 10/11/2020
      • 27/10/2020
      • 13/10/2020
      • 29/09/2020
      • 15/09/2020
      • 01/09/2020
      • 18/08/2020
      • 03/08/2020
      • 21/07/2020
      • 08/07/2020
      • 30/06/2020
      • 04/06/2020
      • 22/05/2020
      • 14/05/2020
      • 29/04/2020
      • 01/04/2020
      • 24/03/2020
      • 16/03/2020
    • Glossário
Powered by GitBook
On this page
  • Estrutura
  • Atributos
  • Exemplo
  • Inverter Lista
  • Atributos
  • Conversão para o canal ABC
  • WhatsApp Zenvia
  • Skip Curatorship

Was this helpful?

  1. Build
  2. Assistentes
  3. Builder
  4. Componentes
  5. Input

Lista inline

Lista de opções com rolagem

Exibe uma lista de opções, que ocupa uma parte da tela. Se a lista ultrapassar o tamanho de visualização de itens por vez, é possível que o usuário use a rolagem para visualizar os demais.

Estrutura

{
    "default": {
        "type": "select",
        "payload": {
            "pick": "pergunta",
            "tries": 3,
            "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"
                }
            ],
            "mandatory": true,
            "error_message": [
                "Você errou, tente novamente",
                "Por favor tente uma última vez",
                "Não consegui validar o seu cpf, tente novamente mais tarde"
            ],
            "showTextInput": true
        }
    }
}

Atributos

  • type: select.

  • payload:

    • pick: mensagem que será exibido no cabeçalho da lista de opções.

    • showTextInput (opcional): se passado o valor true, exibe o input de texto junto com a lista de opções, permitindo ao usuário escolher um item da lista ou digitar o que desejar.

    • accentSensitive (opcional): Considera acentuações.

    • hideArrows (opcional): se passado o valor true, esconde as setas de scroll para cima e para baixo.

    • multiple:

      • (default: false): se passado o valor true, o usuário poderá selecionar uma ou mais opções.

        • Com múltipla seleção o input que é passado para o builder possui as opções selecionadas separadas por vírgula no text e um array no values. Ex:

            {
                "text": "option1,option2,option3",
                "values": [
                    "option1",
                    "option2",
                    "option3"
                ]
            }
      • (default: true): Determinará o numero de campos a serem selecionados

        • max (opcional): Quantidade máxima de opções que podem ser selecionadas

        • min (opcional): Quantidade mínima de opções que podem ser selecionadas

        {          
              "multiple": true,
                    "max": 2,
                    "min": 1
        }
    • mandatory (default: true):booleano, determina se o usuário precisa escolher uma nota para avançar ou não.booleano

      • tries:(opcional) inteiro > 0, corresponde à quantidade de tentativas que queremos

      • error_message:(opcional) array de strings, corresponde as mensagens que serão exibidas sequencialmente após cada erro

    • 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.

    • fuzzyThreshold (default: 0.3): determina o quão próximo da opção da lista o usuário precisará digitar. Aceita valores de 0 a 1.

      • Para usar esse atributo é necessário setar o fuzzy: true.

      • Se 0, somente inputs exatos serão aceitos. Se 1, qualquer input será aceito.

      • A opção será considerada somente se o que o usuário digitar, tiver uma reconhecimento abaixo do threshold (maior precisão). Cabe a quem estiver programando o fluxo definir o melhor valor, na situação em que está trabalhando.

    • fuzzyMinMatchCharLength (default: 5): define a quantidade mínima de caracteres digitados para que possa retornar uma busca.

    • fuzzy (default: false): determina se irá utilizar a busca por aproximação, para detecção do input do usuário.

      • A busca difusa (fuzzy searching) é a técnica de encontrar strings que são aproximadamente iguais a um determinado padrão (em vez de exatamente).

      • Se true, o considerado em cada option, na busca pela aproximação, é o valor do title ou do value, e o que mais se aproximar daquilo que foi digitado pelo usuário será o resultado escolhido.

    • Delay (opcional): tempo (milissegundos) de atraso antes da próxima opção aparecer.

    • options: opções que serão exibidas ao usuário a medida que ele digita.

      • title: título (label) da opção que estará visível ao usuário

      • value: valor que será enviado ao Zenvia NLU ao escolher a opção. Se não for definido, será passado o próprio title

      • cognitive (default: true): determina se a opção ao ser selecionada será enviada para curadoria ou não. Este atributo pega como referência o texto do value

A validação do input que é passado para o builder possui um valor boolean (true ou false).

{
	"valid": true|false
}

Exemplo

{
    "default": {
        "type": "select",
        "payload": {
        "pick": "Por favor, escolha uma das opções:",
        "options": [
            {
                "title": "Como eu consulto minha conta de energia?",
                "value": "Como eu consulto minha conta de energia?"
            },
            {
                "title": "Como eu faço para religar minha energia?",
                "value": "Como eu faço para religar minha energia?"
            },
            {
                "title": "Como eu peço uma nova ligação de energia?",
                "value": "Como eu peço uma nova ligação de energia?"
            },
            {
                "title": "Outras",
                "value": "Outras",
                "cognitive": false
            },
            {
                "title": "Quero encerrar a conversa",
                "value": "Quero encerrar a conversa",
                "cognitive": false
            }
        ]
        }
    }
}

Inverter Lista

Permite a inversão da ordem das opções, por exemplo:

{
    "default": {
        "type": "select",
        "payload": {
            "pick": "Qual destes sabores você gostaria de experimentar hoje:",
            "options": [
                {
                    "title": "1 - Calabresa",
                    "value": "calabresa"
                },
                {
                    "title": "2 - Portuguesa",
                    "value": "portuguesa"
                },
                {
                    "title": "3 - Palmito",
                    "value": "palmito"
                },
                {
                    "title": "4 - Escarola",
                    "value": "escarola"
                },
                {
                    "title": "5 - Peperoni",
                    "value": "peperoni"
                }
            ],
            "reverse": true
        }
    }
}

Atributos

  • reverse: por padrão está definido como false, deve ser definido como true para alterar a sequência.

Exemplo

Caso o reverse não seja adicionado no payload ou seja definido um valor diferente de true , a ordem não será afetada.

Conversão para o canal ABC

Para utilizar, deve acessar as opções avançadas presente na edição de integrações da Live Person, lá terá um campo onde poderá ser feito o cadastro de um metadata, após isso é só utilizar o componente no builder que a conversão será feita automaticamente.

{
    "default": {
        "type": "select",
        "payload": {
            "pick": "seleciona ai",
            "options": [
                {
                    "title": "opção 1",
                    "value": "1",
                    "image": "url da imagem 1"
                },
                {
                    "title": "opção 2",
                    "value": "2"
                    "image": "url da imagem 2"
                }
            ]
        }
    }
}

Atributos:

  • title: título (label) da opção que estará visível ao usuário

  • value: valor que será enviado ao Zenvia NLU ao escolher a opção. Se não for definido, será passado o próprio title

  • image: será inserido uma url de uma imagem que aparecerá no componente de ABC.

Essa funcionalidade serve apenas para canais ABC, os demais canais não utiliza o atributo image dos componentes option_list.

WhatsApp Zenvia

Para input do tipo select com um quantidade de options menores ou iguais a 10, será usado o componente de lista que possui alguns campos extras que podem ser editados como o botão e o Título da lista, também é possível atrelar uma descrição para cada item.

Segue um exemplo de payload cujo botão e título da lista estão personalizados:

{
    "default": {
        "type": "select",
        "payload": {
            "pick": "Qual item deseja escolher?",
            "button": "Escolhas",
            "sectionTitle": "Escolha um:",
            "options": [
                {
                    "title": "opção 1",
                    "value": "row1",
                    "description": "Descrição item 1"
                },
                {
                    "title": "opção 2",
                    "value": "row2",
                    "description": "Descrição item 2"
                },
                {
                    "title": "opção 3",
                    "value": "row3",
                    "description": "Descrição item 3"
                },
                {
                    "title": "opção 4",
                    "value": "row4",
                    "description": "Descrição item 4"
                },
                {
                    "title": "opção 5",
                    "value": "row5",
                    "description": "Descrição item 5"
                }
            ]
        }
    }
}

Caso os campos button e sectionTitle não forem usados, um texto padrão será exibido.

  • Para o button o texto padrão é: Opções

  • Para o sectionTitle o texto padrão é: Escolha uma opção

{
    "default": {
        "type": "option_list",
        "payload": {
            "pick": "Escolha algo:",
            "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"
                },
                {
                    "title": "opção 4",
                    "value": "valor da opção 4"
                },
                {
                    "title": "opção 5",
                    "value": "valor da opção 5"
                }
            ]
        }
    }
}

Caso a quantidade de opções ultrapasse o limite de 10, uma lista numérica será exibida.

Qual item deseja escolher?


1 - opção 1
2 - opção 2
3 - opção 3
4 - opção 4
5 - opção 5
6 - opção 6
7 - opção 7
8 - opção 8
9 - opção 9
10 - opção 10
11 - opção 11
12 - opção 12

Pontos de atenção, os campos da lista tem tamanhos limitados:

  • button: 10 caracteres

  • sectionTitle: 24 caracteres

  • description: 72 caracteres

  • value: string de no máximo 24 caracteres

  • title: 24 caracteres

Caso o limite de algum desses for ultrapassado, o texto será cortado para o limite máximo esperado.

Skip Curatorship

Envie uma flag para indicar que a mensagem recebida naquele nó não deve ser enviada para a curadoria.

{
    "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).

PreviousFeedback CustomNextLista modal

Last updated 2 years ago

Was this helpful?

Para tanto, utilizamos a lib . O playground deles disponível , permitirá que os programadores de fluxos testem as opções que disponibilizamos como, fuzzyMinMatchCharLength (minMatchCharLength, na Fuse.js) e fuzzyThreshold (threshold, na Fuse.js)

Fuse.js
aqui