@jexity/chat-widget

Embeddable AI chat widget for any website. Add customer support chat with a single <script> tag or via npm.

Quick Start

Script Tag (No Build Tools Required)

<script
  src="https://unpkg.com/@jexity/chat-widget/dist/widget.js"
  data-org-id="YOUR_ORG_ID"
></script>

NPM

npm install @jexity/chat-widget

import { JexityChat } from '@jexity/chat-widget'

const chat = JexityChat({
  orgId: 'YOUR_ORG_ID',
})

// Later: chat.shutdown()

React Provider

import { JexityChatProvider, useJexityChat } from '@jexity/chat-widget/react'

function App() {
  return (
    <JexityChatProvider orgId="YOUR_ORG_ID">
      <HomePage />
    </JexityChatProvider>
  )
}

function HomePage() {
  const { open, close, toggle, isOpen } = useJexityChat()
  return <button onClick={open}>Chat with us</button>
}

Configuration

| Option | Type | Default | Description | |--------|------|---------|-------------| | orgId | string | required | Your organization ID | | container | string \| HTMLElement | auto-created div | CSS selector or element to mount into | | position | 'bottom-right' \| 'bottom-left' | 'bottom-right' | Widget position on screen | | theme | 'light' \| 'dark' \| 'auto' | 'auto' | Color theme | | greeting | string | 'Hi there! How can I help?' | Initial bot message | | title | string | 'Jexity Assistant' | Chat window header title | | primaryColor | string | '#0070f3' | Brand color (hex) |

Programmatic API

const chat = JexityChat(options)

chat.open()      // Open the chat window
chat.close()     // Close the chat window
chat.toggle()    // Toggle open/closed
chat.shutdown()  // Remove widget from DOM
chat.isOpen      // readonly boolean

Script Tag Global

<script src="https://cdn.jexity.chat/widget/latest/widget.js" data-org-id="YOUR_ORG_ID"></script>
<script>
  window.JexityChat.open()
  window.JexityChat.shutdown()
</script>

License

MIT