botui

A JavaScript framework for creating conversational UIs.

Main Site - Read Docs - Examples

🚨 Note

This version is using a completely different approach for building UIs. Do no use it as a drop-in replacement for the previous version.

Example usage in React

import { useEffect } from 'react'
import { createRoot } from 'react-dom/client'

import { createBot } from 'botui'
import { BotUI, BotUIMessageList, BotUIAction, useBotUI } from '@botui/react'

const myBot = createBot()

<div id="botui-app"></div>

const App = () => {

  useEffect(() => {
    myBot.message.add({
      text: 'hey'
    })
      .then(() => myBot.wait({ waitTime: 1000 }))
      .then(() => myBot.message.add({ text: 'what is your name?' }))
      .then(() =>
        myBot.action.set(
          {
            options: [
              { label: 'John', value: 'john' },
              { label: 'Jane', value: 'jane' },
            ],
          },
          { input: 'select' }
        )
      )
      .then((data) =>
        myBot.message.add({ text: `nice to meet you ${data.text}` })
      )
  }, [])

  return <div>
    <BotUI bot={myBot}>
      <BotUIMessageList />
      <BotUIAction />
    </BotUI>
  </div>
}

const containerElement = document.getElementById('botui-app')
const root = createRoot(containerElement)
root.render(<App />)

License

MIT License - Copyrights (c) 2017-22 - Moin Uddin