i chatbot

eu-chatbot

Componente simples e elegante para construção de interfaces conversacionais no React. ??

Começando

Instalação

 npm i i-chatbot --save

Uso Básico

Componente de importação

 import ChatBot, { ChatBotUtil } from 'i-chatbot'

Crie métodos que irão lidar com eventos de postback de um chatbot. Deve retornar uma matriz de objetos de mensagem para responder à ação do usuário com um retorno de chamada.

  getStarted () {
    return [
      ChatBotUtil.textMessage(['Hi!', 'Hey there!'].any()),
      ChatBotUtil.textMessage(['How is life?', 'What's up?'].any(),
        ChatBotUtil.makeReplyButton('Great!', this.intro))
    ]
  }

  intro () {
    return [
      ChatBotUtil.textMessage('That's good to hear!')
    ]
  }

Renderize o ChatBot com um método de retorno de chamada de introdução e um botão Iniciar.

 <ChatBot onGetStarted={this.getStarted}
         getStartedButton={ChatBotUtil.makeGetStartedButton('Get Started')} />

Bot de bate-papo

Adereços

Suporte	Padrão	Tipo	Descrição
onGetStarted	-	função	Método de retorno de chamada inicial para retornar as primeiras mensagens
getStartedButton	-	objeto	Parâmetros do botão Iniciar

Métodos

recomeçar (mensagem)

Redefine um estado de bate-papo e adiciona um objeto de mensagem se nenhum botão de início estiver definido.

ChatBotUtil

Métodos

textMessage (texto, ... ações)

Crie um objeto de mensagem de texto.

Parâmetros:

Nome	Tipo	Descrição
texto	corda	Texto da mensagem
ações	objeto(s)	Objeto(s) de botão(ões) de resposta rápida

userTextMessage (texto)

Crie um objeto de mensagem de texto do usuário.

Parâmetros:

Nome	Tipo	Descrição
texto	corda	Texto da mensagem

makeReplyButton (título)

Crie um botão para começar.

Parâmetros:

Nome	Tipo	Descrição
título	corda	Título

makeReplyButton (título, postback)

Crie um botão de resposta rápida.

Parâmetros:

Nome	Tipo	Descrição
título	corda	Título
postagem	corda	Valor de postback

makeTextInputField (título, postback)

Crie um campo de entrada de texto.

Parâmetros:

Nome	Tipo	Descrição
enviar	corda	Título do botão enviar
espaço reservado	corda	Espaço reservado para campo de entrada
postagem	corda	Valor de postback

Estilo

Como pré-processador CSS é usado MENOS. Copie e modifique estilos de demo/src/i-chatbot.less e importe para seu aplicativo.

Construído com i-chatbot ?

• Site pessoal de Oleh Stasula
• Página inicial de Justin Case

Você construiu algo legal com i-chatbot ? Envie uma solicitação pull e adicione-a a esta lista!

Pendência ?

• Direção de bate-papo de baixo para cima
• Melhor validação de entrada
• Espaço reservado para avatar

Contribuição?

Sua contribuição é bem-vinda, não importa quão grande ou pequena!

Por favor, dê uma olhada no guia de contribuição para detalhes sobre estrutura do projeto, ambiente de desenvolvimento, conjunto de testes, estilo de código, etc. Todas as atualizações de versão são mencionadas no changelog.

Licença?

A biblioteca está disponível como código aberto sob os termos da licença MIT.