You can use the Fab (Floating Action Button) component to toggle the visibility of the Webchat UI in your application:

Usage

import { Fab } from '@botpress/webchat'

function App() {
  const [isWebchatOpen, setIsWebchatOpen] = useState(false)

  return <Fab onClick={() => setIsWebchatOpen(!isWebchatOpen)} />
}

Props

onClick
MouseEventHandler<HTMLButtonElement>

A callback function triggered when the Fab is clicked. Commonly used to toggle the Webchat visibility.